All files / lib/internal icon-container.directive.ts

100% Statements 71/71
100% Branches 16/16
100% Functions 7/7
100% Lines 71/71

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 721x 1x 1x 1x 1x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 5649x 1x 1x 1x 91019x 91019x 91019x 1x 1x 91019x 91019x 91019x 1x 1x 1x 91019x 91019x 2960x 88059x 91019x 1x 1x 1x 91019x 91019x 2960x 88059x 91019x 1x  
import { Directive, HostBinding, Input } from '@angular/core';
 
/**
 * Helper directive for proper rendering of icons throughout the library.
 */
@Directive({
  selector: '[data-gc-icon-container]',
  host: {
    class: 'gc-icon-container',
  },
})
export class IconContainerDirective {
  /**
   * The bounding box in px.
   */
  @Input()
  @HostBinding('style.width.px')
  @HostBinding('style.height.px')
  @HostBinding('style.fontSize.px')
  public boundingBox = 16;
 
  /**
   * If dualtone colors are inverted
   */
  @Input()
  public inverted = false;
 
  /**
   * Turn on auto-centering
   */
  @Input()
  public autoResize = false;
 
  /** @ignore */
  @HostBinding('style.display')
  protected readonly cssDisplay = 'grid';
 
  /** @ignore */
  @HostBinding('style.overflow')
  protected overflow = 'clip';
  /** @ignore */
  @HostBinding('style.alignItems')
  protected cssAlignItems = 'center';
 
  /** @ignore */
  @HostBinding('style.grid-template')
  protected get cssGridTemplate(): string | null {
    return `${this.boundingBox.toFixed(0)}px/${this.boundingBox.toFixed(0)}px`;
  }
 
  @HostBinding('style.placeItems')
  protected get cssPlaceItems() {
    return this.autoResize ? 'stretch center' : 'center';
  }
 
  /** @ignore */
  @HostBinding('style.--gc-dualtone-color-1')
  protected get cssDuotoneColor1(): string {
    return this.inverted
      ? 'var(--gc-inverted-dualtone-color-1, var(--gc-weiss))'
      : 'var(--gc-default-dualtone-color-1, var(--gc-nacht-blau))';
  }
 
  /** @ignore */
  @HostBinding('style.--gc-dualtone-color-2')
  protected get cssDuotoneColor2(): string {
    return this.inverted
      ? 'var(--gc-inverted-dualtone-color-2, var(--gc-nacht-blau))'
      : 'var(--gc-default-dualtone-color-2, var(--gc-grau-hell))';
  }
}