Allow to use as button

[dimaslz]

I am thinking about to add the property to use the icons as buttons. What do you think? could be useful?

Idea:

Components icons
<academic-cap-outline-icon asButton (click)="yourFunction()" />

Dynamic component icon
<ng-heroicons icon="academic-cap" asButton (click)="yourFunction()" />

On this way, you should avoid to wrap the icons with a button if you want an interaction. And thanks to the new dynamic icon component, could be possible to switch between icons on click.

isActive = false;

toggleFunction() {
  this.isActive != this.isActive;
}

<ng-heroicons 
  icon="academic-cap"  
  [solid]="isActive" <!-- 👈 the icon is solid when the variable isActive is true -->
  [outline]="!isActive" <!-- 👈 the icon is outline when the variable isActive is false -->
  asButton (click)="toggleFunction()" 
/>