libey-ng-component-library 0.0.35 → 0.0.37

package/ng-package.json

@@ -1,13 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/libey-ng-component-library",
-  "lib": {
-    "entryFile": "src/public-api.ts"
-  },
-  "whitelistedNonPeerDependencies": [
-    "angular2-signaturepad",
-    "@ng-select/ng-select",
-    "@ng-bootstrap/ng-bootstrap",
-    "@popperjs/core"
-  ]
-}

package/src/lib/cpm-indicator/libey-ng-cpm-indicator.component.css

@@ -1,216 +0,0 @@
-
-/* ── Host ── */
-:host {
-  display: inline-flex;
-  flex-direction: column;  /* ← agregar */
-  align-items: center;     /* ← agregar */
-  font-family: 'DM Sans', sans-serif;
-}
-
-/* ═══════════════════════════════════════════════════════════
-   GAUGE — compartido entre modo CPM y modo Gauge
-   El modo CPM reutiliza todas estas clases, solo cambia
-   el texto central ("CPM" en lugar del monto)
-═══════════════════════════════════════════════════════════ */
-
-/* ── Tarjeta (solo modo Gauge) ── */
-.card {
-  background: #ffffff;
-  border-radius: 20px;
-  padding: 36px 40px 28px;
-  width: 340px;
-  box-shadow:
-    0 4px 32px rgba(0, 0, 0, 0.10),
-    0 1px 4px rgba(0, 0, 0, 0.06);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-/* ── Gauge SVG ── */
-.gauge-wrap {
-  position: relative;
-  overflow: visible;
-}
-
-.gauge-svg {
-  overflow: visible;
-}
-
-/* ── Valor central ── */
-.gauge-center {
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  text-align: center;
-  pointer-events: none;
-  white-space: nowrap;
-}
-
-/* CPM — una sola línea, necesita más espacio */
-.gauge-center--cpm {
-  bottom: 15px;
-}
-
-/* Gauge — dos líneas (monto + límite) */
-.gauge-center--gauge {
-  bottom: -10px;
-}
-
-.main-value {
-  font-size: 26px;
-  font-weight: 700;
-  font-family: 'DM Mono', monospace;
-  letter-spacing: -0.5px;
-  color: #1a1a2e;
-  line-height: 1;
-  transition: color 0.3s ease;
-}
-
-.limit-label {
-  font-size: 12px;
-  color: #8a8fa8;
-  font-weight: 400;
-  margin-top: 3px;
-  font-family: 'DM Mono', monospace;
-}
-
-/* ── Leyenda ── */
-.legend {
-  display: flex;
-  gap: 14px;
-  margin-top: 22px;
-  margin-bottom: 6px;
-  flex-wrap: wrap;
-  justify-content: center;
-}
-
-.legend-item {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  color: #555;
-  font-weight: 500;
-}
-
-/* ── Punto de leyenda ── */
-.dot {
-  width: 9px;
-  height: 9px;
-  border-radius: 50%;
-  flex-shrink: 0;
-}
-
-/* ── Separador ── */
-.divider {
-  width: 100%;
-  height: 1px;
-  background: #f0f2f5;
-  margin: 14px 0 4px;
-}
-
-/* ── Badge dev mode ── */
-.dev-badge {
-  font-size: 11px;
-  font-weight: 700;
-  color: #7c3aed;
-  background: #ede9fe;
-  border-radius: 6px;
-  padding: 3px 10px;
-  margin-bottom: 8px;
-  letter-spacing: 0.3px;
-}
-
-/* ── Controles devMode ── */
-.controls {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
-.ctrl-row {
-  display: flex;
-  flex-direction: column;
-  gap: 5px;
-}
-
-.ctrl-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.ctrl-label {
-  font-size: 12px;
-  color: #8a8fa8;
-  font-weight: 500;
-  display: flex;
-  align-items: center;
-  gap: 5px;
-}
-
-.ctrl-label-dot {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  display: inline-block;
-  flex-shrink: 0;
-}
-
-.ctrl-val {
-  font-size: 12px;
-  font-family: 'DM Mono', monospace;
-  font-weight: 600;
-  color: #1a1a2e;
-}
-
-.zones-bar {
-  display: flex;
-  border-radius: 4px;
-  overflow: hidden;
-  height: 3px;
-  width: 100%;
-  margin-bottom: 3px;
-}
-
-.zones-bar div { flex: 1; }
-
-/* ── Slider ── */
-input[type='range'] {
-  -webkit-appearance: none;
-  appearance: none;
-  width: 100%;
-  height: 5px;
-  border-radius: 99px;
-  background: #e2e6ef;
-  outline: none;
-  cursor: pointer;
-}
-
-input[type='range']::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  width: 18px;
-  height: 18px;
-  border-radius: 50%;
-  background: #16a34a;
-  border: 2.5px solid #fff;
-  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
-  cursor: grab;
-  transition: background 0.3s, transform 0.15s;
-}
-
-input[type='range']::-webkit-slider-thumb:active {
-  transform: scale(1.2);
-  cursor: grabbing;
-}
-
-input[type='range']::-moz-range-thumb {
-  width: 18px;
-  height: 18px;
-  border-radius: 50%;
-  background: #16a34a;
-  border: 2.5px solid #fff;
-  cursor: grab;
-}

package/src/lib/cpm-indicator/libey-ng-cpm-indicator.component.html

@@ -1,201 +0,0 @@
-<!-- Modo CPM: solo el gauge con "CPM" en el centro -->
-<ng-container *ngIf="mode === CpmIndicatorMode.Cpm">
-  <div class="gauge-wrap" [style.width.px]="220 * scale" [style.height.px]="120 * scale">
-    <svg class="gauge-svg" viewBox="0 0 220 130" xmlns="http://www.w3.org/2000/svg"
-    [style.width.px]="220 * scale"
-    [style.height.px]="135 * scale">
-      <defs>
-        <filter id="dotShadowCpm" x="-60%" y="-60%" width="220%" height="220%">
-          <feDropShadow dx="0" dy="1" stdDeviation="2" flood-color="rgba(0,0,0,0.22)"/>
-        </filter>
-      </defs>
-
-      <path [attr.d]="trackArcPath" fill="none" stroke="#E8EAEF" stroke-width="14" stroke-linecap="round"/>
-
-      <!-- Proyección debajo, real encima -->
-      <path
-        [style.display]="totalAmount > 0 ? '' : 'none'"
-        [attr.d]="totalArcPath"
-        [attr.stroke]="activeColors.light"
-        fill="none" stroke-width="14" stroke-linecap="round"/>
-
-      <path
-        [style.display]="baseAmount > 0 ? '' : 'none'"
-        [attr.d]="baseArcPath"
-        [attr.stroke]="activeColors.dark"
-        fill="none" stroke-width="14" stroke-linecap="round"/>
-
-      <circle
-        [style.display]="baseAmount > 0 ? '' : 'none'"
-        [attr.cx]="dotBasePos.x" [attr.cy]="dotBasePos.y"
-        r="7" [attr.fill]="activeColors.dark"
-        stroke="#ffffff" stroke-width="2.5"
-        filter="url(#dotShadowCpm)"/>
-
-      <!-- Solo visible si la proyección va por delante del real -->
-      <circle
-        [style.display]="dotTotalVisible ? '' : 'none'"
-        [attr.cx]="dotTotalPos.x" [attr.cy]="dotTotalPos.y"
-        r="6" [attr.fill]="activeColors.light"
-        stroke="#ffffff" stroke-width="2.5"
-        filter="url(#dotShadowCpm)"/>
-    </svg>
-
-    <div class="gauge-center gauge-center--cpm" [style.bottom.px]="15 * scale">
-      <div class="main-value" [style.font-size.px]="26 * scale">CPM</div>
-    </div>
-  </div>
-</ng-container>
-
-
-<!-- Modo Gauge: gauge completo con montos, leyenda y alerta -->
-<ng-container *ngIf="mode === CpmIndicatorMode.Gauge">
-  <div class="gauge-wrap" [style.width.px]="220 * scale" [style.height.px]="120 * scale">
-    <svg class="gauge-svg" viewBox="0 0 220 130" xmlns="http://www.w3.org/2000/svg"
-    [style.width.px]="220 * scale"
-    [style.height.px]="135 * scale">
-      <defs>
-        <filter id="dotShadowGauge" x="-60%" y="-60%" width="220%" height="220%">
-          <feDropShadow dx="0" dy="1" stdDeviation="2" flood-color="rgba(0,0,0,0.22)"/>
-        </filter>
-      </defs>
-
-      <path [attr.d]="trackArcPath" fill="none" stroke="#E8EAEF" stroke-width="14" stroke-linecap="round"/>
-
-      <!-- Proyección debajo, real encima -->
-      <path
-        [style.display]="totalAmount > 0 ? '' : 'none'"
-        [attr.d]="totalArcPath"
-        [attr.stroke]="activeColors.light"
-        fill="none" stroke-width="14" stroke-linecap="round"/>
-
-      <path
-        [style.display]="baseAmount > 0 ? '' : 'none'"
-        [attr.d]="baseArcPath"
-        [attr.stroke]="activeColors.dark"
-        fill="none" stroke-width="14" stroke-linecap="round"/>
-
-      <circle
-        [style.display]="baseAmount > 0 ? '' : 'none'"
-        [attr.cx]="dotBasePos.x" [attr.cy]="dotBasePos.y"
-        r="7" [attr.fill]="activeColors.dark"
-        stroke="#ffffff" stroke-width="2.5"
-        filter="url(#dotShadowGauge)"/>
-
-      <circle
-        [style.display]="dotTotalVisible ? '' : 'none'"
-        [attr.cx]="dotTotalPos.x" [attr.cy]="dotTotalPos.y"
-        r="6" [attr.fill]="activeColors.light"
-        stroke="#ffffff" stroke-width="2.5"
-        filter="url(#dotShadowGauge)"/>
-
-      <!-- <text
-        [attr.x]="limitTextPos.x" [attr.y]="limitTextPos.y"
-        font-family="DM Mono,monospace" font-size="9" font-weight="600"
-        fill="#8a8fa8" text-anchor="middle">
-        {{ currency }}{{ limit }}
-      </text> -->
-    </svg>
-
-    <!-- El color del monto cambia a rojo si supera el límite -->
-    <div class="gauge-center gauge-center--gauge" [style.bottom.px]="-10 * scale">
-      <div class="main-value"
-          [style.font-size.px]="26 * scale"
-          [style.color]="totalAmount > limit ? activeColors.dark : '#1a1a2e'">
-        CPM<br>
-        {{ currency }}{{ totalAmount | number:'1.2-2' }}
-      </div>
-      <div class="limit-label" [style.font-size.px]="16 * scale">
-        de {{ currency }}{{ limit | number:'1.2-2' }}
-      </div>
-    </div>
-  </div>
-
-  <div class="legend">
-    <div class="legend-item">
-      <span class="dot" [style.background]="activeColors.dark"></span>
-      Real
-    </div>
-    <div class="legend-item">
-      <span class="dot"
-            [style.background]="activeColors.light"
-            [style.border]="'1.5px solid ' + activeColors.dark">
-      </span>
-      Proyección
-    </div>
-    <div class="legend-item">
-      <span class="dot" style="background:#e8ecf5; border:1px solid #ccc"></span>
-      Disponible
-    </div>
-  </div>
-
-  <!-- Sliders de prueba — solo en devMode -->
-  <ng-container *ngIf="devMode">
-    <div class="divider"></div>
-    <div class="dev-badge">Dev Mode</div>
-    <div class="controls">
-
-      <div class="ctrl-row">
-        <div class="ctrl-header">
-          <span class="ctrl-label">
-            <span class="ctrl-label-dot" [style.background]="activeColors.dark"></span>
-            Gasto real (consumido)
-          </span>
-          <span class="ctrl-val" [style.color]="activeColors.dark">
-            {{ currency }}{{ sliderBase | number:'1.2-2' }}
-          </span>
-        </div>
-        <div class="zones-bar">
-          <div style="background:#16a34a"></div>
-          <div style="background:#ca8a04"></div>
-          <div style="background:#ea580c"></div>
-          <div style="background:#dc2626"></div>
-        </div>
-        <input type="range" [min]="0" [max]="sliderMax" step="0.5"
-               [value]="sliderBase" (input)="onDevBaseChange($event)">
-      </div>
-
-      <div class="ctrl-row">
-        <div class="ctrl-header">
-          <span class="ctrl-label">
-            <span class="ctrl-label-dot"
-                  [style.background]="activeColors.light"
-                  [style.border]="'1px solid ' + activeColors.dark"
-                  style="border-radius:50%">
-            </span>
-            Proyección (presupuesto)
-          </span>
-          <span class="ctrl-val" [style.color]="activeColors.dark">
-            {{ currency }}{{ sliderProjected | number:'1.2-2' }}
-          </span>
-        </div>
-        <div class="zones-bar">
-          <div style="background:#16a34a"></div>
-          <div style="background:#ca8a04"></div>
-          <div style="background:#ea580c"></div>
-          <div style="background:#dc2626"></div>
-        </div>
-        <input type="range" [min]="0" [max]="sliderMax" step="0.5"
-               [value]="sliderProjected" (input)="onDevProjectedChange($event)">
-      </div>
-
-    </div>
-  </ng-container>
-</ng-container>
-
-<ng-template #cpmLegend>
-  <div class="legend-tooltip">
-    <div class="legend-tooltip__item">
-      <span class="dot" [style.background]="activeColors.dark"></span>
-      Real<span *ngIf="mode === CpmIndicatorMode.Gauge">: {{ currency }}{{ baseAmount | number:'1.2-2' }}</span>
-    </div>
-    <div class="legend-tooltip__item">
-      <span class="dot" [style.background]="activeColors.light"></span>
-      Proyección<span *ngIf="mode === CpmIndicatorMode.Gauge">: {{ currency }}{{ projectedAmount | number:'1.2-2' }}</span>
-    </div>
-    <div class="legend-tooltip__item">
-      <span class="dot" style="background:#e8ecf5"></span>
-      Disponible<span *ngIf="mode === CpmIndicatorMode.Gauge">: {{ currency }}{{ (limit - totalAmount) | number:'1.2-2' }}</span>
-    </div>
-  </div>
-</ng-template>

package/src/lib/cpm-indicator/libey-ng-cpm-indicator.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LibeyNgCpmIndicatorComponent } from './libey-ng-cpm-indicator.component';
-
-describe('LibeyNgCpmIndicatorComponent', () => {
-  let component: LibeyNgCpmIndicatorComponent;
-  let fixture: ComponentFixture<LibeyNgCpmIndicatorComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ LibeyNgCpmIndicatorComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LibeyNgCpmIndicatorComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/cpm-indicator/libey-ng-cpm-indicator.component.ts

@@ -1,203 +0,0 @@
-import { Component, Input, OnInit, OnChanges, SimpleChanges, Output, EventEmitter, ViewChild, TemplateRef } from '@angular/core';
-import { CpmIndicatorMode,CpmItemType,CpmItem,CpmThresholds,CpmSummary,ZoneColor,SvgPoint,DEFAULT_THRESHOLDS,ZONE_COLORS, CpmColorState,} from '../../utils/CpmIndicator/cpm-indicator-types';
-
-@Component({
-  selector: 'lib-libey-ng-cpm-indicator',
-  templateUrl: './libey-ng-cpm-indicator.component.html',
-  styleUrls: ['./libey-ng-cpm-indicator.component.css']
-})
-export class LibeyNgCpmIndicatorComponent implements OnInit, OnChanges {
-
-  /** Tope máximo del contrato. */
-  @Input() limit: number = 250;
-
-  /**
-   * Ítems de gasto. El padre es responsable de:
-   * - Excluir ítems que no aplican al CPM
-   * - Marcar cada uno con CpmItemType.Base o CpmItemType.Projected
-   * - Actualizar el array al agregar o eliminar
-   */
-  @Input() items: CpmItem[] = [];
-
-  /** Símbolo de moneda. Por defecto 's/' (sol peruano). */
-  @Input() currency: string = 's/';
-
-  /** Umbrales de zonas como porcentaje del límite (0.0 → 1.0). Usa tercios si no se proporciona. */
-  @Input() thresholds?: CpmThresholds;
-
-  /** Modo de visualización: CPM (solo gauge) o Gauge (montos + leyenda). */
-  @Input() mode: CpmIndicatorMode = CpmIndicatorMode.Cpm;
-
-  /** Activa sliders de prueba. Solo para desarrollo, nunca en producción. */
-  @Input() devMode: boolean = false;
-
-  // ── Outputs ──
-  /** Emite el resumen de montos en cada recalculo. Usar para persistir en BD. */
-  @Output() cpmChange = new EventEmitter<CpmSummary>();
-
-  /** Emite true cuando la proyección supera el límite. */
-  @Output() limitExceeded = new EventEmitter<boolean>();
-
-  @ViewChild('cpmLegend') cpmLegend!: TemplateRef<any>;
-
-  @Output() colorChange = new EventEmitter<CpmColorState>();
-
-  @Input() scale: number = 1;
-
-  // ── Propiedades del template ──
-  baseAmount: number      = 0;
-  projectedAmount: number = 0;
-  totalAmount: number     = 0;
-  excess: number          = 0;
-  activeColors: ZoneColor = ZONE_COLORS['zone1'];
-
-  trackArcPath: string     = '';
-  baseArcPath: string      = '';
-  totalArcPath: string     = '';
-  dotBasePos: SvgPoint     = { x: 0, y: 0 };
-  dotTotalPos: SvgPoint    = { x: 0, y: 0 };
-  dotTotalVisible: boolean = false;
-  limitTextPos: SvgPoint   = { x: 0, y: 0 };
-
-  // ── devMode ──
-  sliderBase: number      = 0;
-  sliderProjected: number = 0;
-
-  get sliderMax(): number {
-    return this.limit * 1.5;
-  }
-
-  // Necesario para usar el enum en el template
-  readonly CpmIndicatorMode = CpmIndicatorMode;
-
-  // Geometría del SVG (coordenadas internas del viewBox 220x130)
-  private readonly CX          = 110;
-  private readonly CY          = 115;
-  private readonly R           = 90;
-  private readonly ANGLE_START = Math.PI;
-  private readonly ANGLE_END   = 0;
-
-  private readonly EXCESS_TOLERANCE = 0.005;
-
-  constructor() {}
-
-  ngOnInit(): void {
-    this.recalculate();
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['items'] || changes['limit'] || changes['thresholds']) {
-      this.recalculate();
-    }
-  }
-
-  onDevBaseChange(event: Event): void {
-    this.sliderBase = parseFloat((event.target as HTMLInputElement).value);
-    if (this.sliderBase > this.sliderProjected) {
-      this.sliderProjected = this.sliderBase;
-    }
-    this.recalculateFromSliders();
-  }
-
-  onDevProjectedChange(event: Event): void {
-    this.sliderProjected = parseFloat((event.target as HTMLInputElement).value);
-    if (this.sliderProjected < this.sliderBase) {
-      this.sliderProjected = this.sliderBase;
-    }
-    this.recalculateFromSliders();
-  }
-
-  // Flujo de producción: calcula a partir del array de items
-  private recalculate(): void {
-    this.baseAmount = this.items
-      .filter(i => i.type === CpmItemType.Base)
-      .reduce((acc, i) => acc + i.amount, 0);
-
-    this.projectedAmount = this.items
-      .filter(i => i.type === CpmItemType.Projected)
-      .reduce((acc, i) => acc + i.amount, 0);
-
-    this.totalAmount = this.baseAmount + this.projectedAmount;
-
-    // Sincroniza sliders por si se activa devMode
-    this.sliderBase      = this.baseAmount;
-    this.sliderProjected = this.totalAmount;
-
-    this.updateGauge();
-    this.emitSummary();
-  }
-
-  // Flujo de devMode: calcula a partir de los sliders
-  private recalculateFromSliders(): void {
-    this.baseAmount      = this.sliderBase;
-    this.projectedAmount = this.sliderProjected - this.sliderBase;
-    this.totalAmount     = this.sliderProjected;
-
-    this.updateGauge();
-    this.emitSummary();
-  }
-
-  private updateGauge(): void {
-    const thresholds  = this.thresholds ?? DEFAULT_THRESHOLDS;
-    this.activeColors = this.getZoneColors(this.totalAmount, thresholds);
-
-    this.trackArcPath = this.buildArcPath(this.ANGLE_START, this.ANGLE_END);
-    this.totalArcPath = this.buildArcPath(this.ANGLE_START, this.valueToAngle(this.totalAmount));
-    this.baseArcPath  = this.buildArcPath(this.ANGLE_START, this.valueToAngle(this.baseAmount));
-
-    this.dotBasePos  = this.polar(this.valueToAngle(this.baseAmount));
-    this.dotTotalPos = this.polar(this.valueToAngle(this.totalAmount));
-
-    // El punto de proyección solo aparece si va delante del real y no llegó al borde
-    this.dotTotalVisible = this.totalAmount > this.baseAmount && this.totalAmount < this.limit;
-
-    this.limitTextPos = this.polar(this.ANGLE_END, this.R + 20);
-
-    this.excess = Math.max(0, this.totalAmount - this.limit);
-    this.limitExceeded.emit(this.excess > this.EXCESS_TOLERANCE);
-
-    this.colorChange.emit({
-      darkColor:    this.activeColors.dark,
-      lightColor:   this.activeColors.light,
-      grayColor:    '#E8EAEF',
-      limitReached: this.totalAmount >= this.limit,
-    });
-  }
-
-  private emitSummary(): void {
-    this.cpmChange.emit({
-      baseAmount:      this.baseAmount,
-      projectedAmount: this.projectedAmount,
-      totalAmount:     this.totalAmount,
-      limit:           this.limit,
-    });
-  }
-
-  // Clampea el valor al límite para que el arco no desborde visualmente
-  private valueToAngle(value: number): number {
-    const clamped = Math.min(value, this.limit);
-    return Math.PI - (clamped / this.limit) * Math.PI;
-  }
-
-  private polar(angle: number, radius: number = this.R): SvgPoint {
-    return {
-      x: this.CX + radius * Math.cos(angle),
-      y: this.CY - radius * Math.sin(angle),
-    };
-  }
-
-  private buildArcPath(a1: number, a2: number): string {
-    const start = this.polar(a1);
-    const end   = this.polar(a2);
-    const large = (a1 - a2) > Math.PI ? 1 : 0;
-    return `M ${start.x} ${start.y} A ${this.R} ${this.R} 0 ${large} 1 ${end.x} ${end.y}`;
-  }
-
-  private getZoneColors(value: number, t: CpmThresholds): ZoneColor {
-    const pct = value / this.limit;
-    if (pct < t.zone1Max) return ZONE_COLORS['zone1'];
-    if (pct < t.zone2Max) return ZONE_COLORS['zone2'];
-    if (pct < t.zone3Max) return ZONE_COLORS['zone3'];
-    return ZONE_COLORS['zone4'];
-  }
-}

package/src/lib/cpm-indicator/libey-ng-cpm-indicator.module.ts

@@ -1,19 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { LibeyNgCpmIndicatorComponent } from './libey-ng-cpm-indicator.component';
-import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
-
-
-
-@NgModule({
-  declarations: [
-    LibeyNgCpmIndicatorComponent
-  ],
-  imports: [
-    CommonModule
-  ],
-  exports: [
-    LibeyNgCpmIndicatorComponent
-  ]
-})
-export class LibeyNgCpmIndicatorModule { }

package/src/lib/icons/icons.component.css

@@ -1,9 +0,0 @@
-.d-inline-flex {
-  display: inline-flex;
-}
-
-button:disabled {
-  svg path {
-    fill: #ABBED1 !important;
-  }
-}