open-index/open-npm huggingface dataset:
npm package: @ghoul007/gh-test2
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.2.0.
Latest version: 0.0.11

# GhTest2

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.2.0.

## Code scaffolding

Run `ng generate component component-name --project gh-test2` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project gh-test2`.
> Note: Don't forget to add `--project gh-test2` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build gh-test2` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build gh-test2`, go to the dist folder `cd dist/gh-test2` and run `npm publish`.

## Running unit tests

Run `ng test gh-test2` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @ghoul007/gh-users
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.
Latest version: 1.0.3

# GhUsers

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.

## Code scaffolding

Run `ng generate component component-name --project gh-users` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project gh-users`.
> Note: Don't forget to add `--project gh-users` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build gh-users` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build gh-users`, go to the dist folder `cd dist/gh-users` and run `npm publish`.

## Running unit tests

Run `ng test gh-users` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @ghoul007/libs
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.
Latest version: 0.1.1

# Libs

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.

## Code scaffolding

Run `ng generate component component-name --project libs` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project libs`.
> Note: Don't forget to add `--project libs` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build libs` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build libs`, go to the dist folder `cd dist/libs` and run `npm publish`.

## Running unit tests

Run `ng test libs` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @ghoul007/my-lib
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.
Latest version: 0.0.1

# MyLib

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.

## Code scaffolding

Run `ng generate component component-name --project my-lib` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project my-lib`.
> Note: Don't forget to add `--project my-lib` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build my-lib` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build my-lib`, go to the dist folder `cd dist/my-lib` and run `npm publish`.

## Running unit tests

Run `ng test my-lib` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @ghoul007/my-lib2
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.
Latest version: 0.0.3

# MyLib2

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.

## Code scaffolding

Run `ng generate component component-name --project my-lib2` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project my-lib2`.
> Note: Don't forget to add `--project my-lib2` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build my-lib2` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build my-lib2`, go to the dist folder `cd dist/my-lib2` and run `npm publish`.

## Running unit tests

Run `ng test my-lib2` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @ghp-libraries/datagrid
Description: coming soon ...
Latest version: 0.0.87

# Datagrid

coming soon ...

<!--
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.

## Code scaffolding

Run `ng generate component component-name --project datagrid` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project datagrid`.
> Note: Don't forget to add `--project datagrid` or else it will be added to the default project in your `angular.json` file.

## Build

Run `ng build datagrid` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build datagrid`, go to the dist folder `cd dist/datagrid` and run `npm publish`.

## Running unit tests

Run `ng test datagrid` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page. -->
npm package: @ghp-libraries/modal
Description: modal library description ... comming 
Author: Mohamed lamine
Latest version: 0.0.41

# Modal

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.2.0.

## Code scaffolding

Run `ng generate component component-name --project modal` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project modal`.
> Note: Don't forget to add `--project modal` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build modal` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build modal`, go to the dist folder `cd dist/modal` and run `npm publish`.

## Running unit tests

Run `ng test modal` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
npm package: @ghp-libraries/toast
Description: <p align="center">   <a href="" rel="noopener">  <img width=200px height=200px src="https://cdn-icons-png.flaticon.com/512/5038/5038297.png" alt="Project logo"></a> </p>
Latest version: 0.1.2

<p align="center">
  <a href="" rel="noopener">
 <img width=200px height=200px src="https://cdn-icons-png.flaticon.com/512/5038/5038297.png" alt="Project logo"></a>
</p>

<h3 align="center">@ghp-libraries/toast</h3>

<div align="center">

[![Status](https://img.shields.io/badge/status-active-success.svg)]()
[![GitHub Pull Requests](https://img.shields.io/github/issues-pr/kylelobo/The-Documentation-Compendium.svg)](https://github.com/kylelobo/The-Documentation-Compendium/pulls)

</div>

---

<p align="center"> @ghp-libraries/toast is a versatile and easy-to-use toast notification  <br> 
</p>

## 📝 Table of Contents

- [Introduction](#Introduction)
- [Installation](#Installation)
- [Usage](#usage)
- [Inputs](#Inputs)
- [Examples](#Examples)

## Introduction

`@ghp-libraries/toast` is a versatile and easy-to-use toast notification component for Angular applications. It allows for customizable toast messages with various position and display options.

## Installation

To install `ToastComponent`, run the following command in your Angular project:

```bash
npm install @ghp-libraries/toast
```

## Usage

### Displaying a Toast

Inject the `ToastService` in your component's constructor and use it to display toasts:

```typescript
import { Component } from "@angular/core";
import { ToastService } from "@ghp-libraries/toast";

@Component({
  selector: "app-example",
  template: `<button (click)="showToast()">Show Toast</button> <ghp-toast />`,
})
export class ExampleComponent {
  constructor(private toastService: ToastService) {}

  showToast() {
    this.toastService.show({
      header: "Success",
      body: "This is a success message!",
      // ... other customizable properties ...
    });
  }
}
```

### Removing a Toast

Toasts can be removed either automatically after a delay or manually. To remove a toast manually, you can call the `removeToast` method of the `ToastService`.

### Toast Options

The `show` method of the `ToastService` accepts an object with the following properties:

- `header`: string (Title of the toast)
- `body`: string (Content of the toast)
- `delay`: number (Duration in milliseconds after which the toast will auto-dismiss)
- `position`: string to define toast position ('Top left' | 'Top center' | 'Top right' | 'Middle left' | 'Middle center' | 'Middle right' | 'Bottom left' | 'Bottom center' | 'Bottom right')
- `marginTop`: string to define marginTop;
- `marginRight`: string to define marginRight;
- `marginBottom`: string to define marginBottom;
- `marginLeft`: string to define marginLeft;
- `type`: string to choose toast style ('success' | 'error' | 'info')
  ...

## Examples

comming soon ...

## Contributing

Contributions to improve `ToastComponent` comming soon ...

---