@engie-group/fluid-design-system-angular/src/components/icon-base/icon-base.component.ts

Fluid Design System Angular

import {CommonModule} from '@angular/common';
import {ChangeDetectionStrategy, Component, Input, ViewEncapsulation} from '@angular/core';

@Component({
  selector: 'nj-icon-base',
  templateUrl: './icon-base.component.html',
  styleUrls: ['./icon-base.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
  encapsulation: ViewEncapsulation.None,
  standalone: true,
  imports: [CommonModule]
})
export class IconBaseComponent {

  private MATERIAL_ICON_CLASS = 'material-icons';
  protected ICON_CLASS = 'nj-icon';

  /**
   * @ignore
   */
  @Input() isEngieIcon = false; //Fixme: Should be inferred by dependency tree. Not being set by input

  /**
   * Icon name
   */
  @Input() name: string;

  /**
   * Text alternative for assistive technologies.
   * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
   */
  @Input() ariaLabel: string;

  /**
   * Icon additional class
   */
  @Input() className: string;

  protected getIconClass(): string {
    if (this.isEngieIcon && !this.name) {
      return '';
    }
    return this.isEngieIcon ? `${this.ICON_CLASS} ${this.ICON_CLASS}-${this.name}` : this.MATERIAL_ICON_CLASS;
  }
}