https://github.com/heyheychicken/angular-wizz
An Angular component that allows you to implement MSN's Wizz in your application.
https://github.com/heyheychicken/angular-wizz
angular
Last synced: about 2 months ago
JSON representation
An Angular component that allows you to implement MSN's Wizz in your application.
- Host: GitHub
- URL: https://github.com/heyheychicken/angular-wizz
- Owner: HeyHeyChicken
- Created: 2023-12-07T06:13:33.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-12-08T12:59:00.000Z (over 2 years ago)
- Last Synced: 2025-08-08T17:24:43.969Z (11 months ago)
- Topics: angular
- Language: TypeScript
- Homepage:
- Size: 1.92 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
**Angular Wizz** is a component that allows you to implement MSN's Wizz in your Angular applications.
## 👋 Introduction
**Angular Wizz** is a component that allows you to implement MSN's Wizz in your Angular applications.
You can add it to your applications for fun, hide an easter egg or sign your work 🤣
## 🔧 Prerequisites
[
Node.js](//nodejs.org/)
[
npm](//npmjs.com/)
[
Angular](//angular.io/)
## ⬇️ Installation
This is a [Node.js](//nodejs.org/en/) module available through the [npm registry](//www.npmjs.com/).
If this is a brand new project, make sure to create an Angular project first with the [`npx ng new myProjectName` command](//angular.io/tutorial/tour-of-heroes/toh-pt0).
Installation is done using the [`npm install` command](//docs.npmjs.com/getting-started/installing-npm-packages-locally):
```console
npm i @heyheychicken/angular-wizz
```
## 🚀 Usage
1) Import the `WizzModule` in your standalone component our in your app module.
```ts
@Component({
...
standalone: true,
imports: [..., WizzModule],
...
})
```
2) Add the WizzComponent in your `app.component.html` file.
```html
...
...
```
3) Just write `WIZZ` (in uppercase) anywhere on your keyboard when you are using you app.
4) (Optional) If you wan't to manualy trigger the wizz, just implement it in your `app.component.ts` file.
```ts
//#region Attributes
@ViewChild('wizzComponent') wizzComponent?: WizzComponent;
//#endregion
//#region Function
protected wizzButtonClicked(): void{
this.wizzComponent?.wizz();
}
//#endregion
```
## 💻 Compatibility
"Angular Wizz" has only been officially tested on Angular 17.
Created by [Antoine Duval (HeyHeyChicken)](//antoine.cuffel.fr) with ❤ and ☕ (chocolate) in [Mesnil-Panneville](//en.wikipedia.org/wiki/Mesnil-Panneville).