Micro Interaction Directive for Angular apps - based on native web animations and nothing more..
npm install ng-micro-interact


Using ng-micro-interact will give you:
- Types.
- Excellent/Best performance
Web Animation API It is one of the most performant ways to animate on the Web where supported, letting the browser make its own internal optimizations without hacks, coercion, or Window.requestAnimationFrame().
Easily add micro interactions as follows:
np i ng-micro-interact
``ts
import { NgMicroInteractModule } from 'ng-micro-interact'
import { AppComponent } from './app.component';
@NgModule({
imports: [ BrowserModule, FormsModule, NgMicroInteractModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
`
`html
[type]="'blink'"
[options]="{ duration: 2000}"
[trigger]="'mouseover'"> Blink!
#### [type]
Optional, string - if won't be specified the default be 'fade'
Could be one of the following:
blink,
bounce,
fade,
flicker,
groove,
jelly,
jerk,
pop,
shake,
squeeze,
swing,
tada
#### [trigger]
Optional, string, Event name, if won't be specified the default be 'mouseover'
#### [options]
Optional, KeyframeAnimationOptions, if won't be specified the default be: { duration: 2000 }