All files / lib/badge badge.component.ts

89.58% Statements 86/96
85.71% Branches 6/7
83.33% Functions 5/6
89.58% Lines 86/96

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 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 971x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x 838x       838x 838x 810x 810x 810x 838x 838x 838x 11793x 11793x 11793x 11793x 11793x               11793x 11793x 11793x 11793x 838x 838x 838x 1x  
/*******************************************************************************
 * Copyright bei
 * Entwicklungs- und Pflegeverbund für das gemeinsame Fachverfahren gefa
 *
 *******************************************************************************/
import { Component, HostBinding, Input } from '@angular/core';
 
import { BadgeColor, BadgeStatus, BadgeVariant } from '../utils/util.types';
 
export type LabelContentDisplay =
  | 'icon-only'
  | 'icon-left'
  | 'icon-right'
  | 'text-only';
 
/**
 * A Badge element can be used as a compact additional information about something in its basic variant, or it can be used as a status indicator of some action.
 * It can optionally display an icon.
 */
@Component({
  selector: 'gc-badge',
  templateUrl: './badge.component.html',
  styleUrls: ['./badge.component.css'],
})
export class BadgeComponent {
  /**
   * The text that shows on the badge.
   */
  @Input()
  public label = '';
 
  /**
   * The visual variant of the badge.
   */
  @Input()
  public variant: BadgeVariant = 'primary';
 
  /**
   * Color theme of the badge.
   */
  @Input()
  public color: BadgeStatus | BadgeColor = 'basic';
 
  /**
   * Define how the content is displayed
   * - icon-only: only the icon is shown
   * - icon-left: icon is shown on the left of the text
   * - icon-right: icon is shown on the right of the text
   * - text-only: only text is displayed
   */
  @Input()
  public contentDisplay: LabelContentDisplay = 'text-only';
 
  /**
   * Control if the text can be wrapped
   */
  @HostBinding('class.gc-allow-text-wrap')
  @Input()
  public allowTextWrap = false;
 
  /**
   * @deprecated
   * Status of the badge that applies an appropriate color theme to the badge.
   */
  @Input()
  public get status(): BadgeStatus {
    return this._status;
  }
 
  public set status(val: BadgeStatus) {
    this.color = val;
    this._status = val;
  }
 
  /** @ignore */
  protected get computedColor(): Exclude<
    BadgeStatus | BadgeColor,
    'black' | 'blue' | 'red' | 'green'
  > {
    switch (this.color) {
      case 'black':
        return 'critical';
      case 'blue':
        return 'basic';
      case 'red':
        return 'error';
      case 'green':
        return 'ok';
      default:
        return this.color;
    }
  }
 
  /** @ignore */
  private _status: BadgeStatus = 'basic';
}