# g0ld-modal

> Modal package for the 14th project of OCR front-end course

Latest version **1.0.5** (published 2023-08-07) · ISC license · 0 weekly downloads

## Install

```sh
npm install g0ld-modal
pnpm add g0ld-modal
yarn add g0ld-modal
bun add g0ld-modal
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.5 |
| Published | 2023-08-07 |
| First published | 2023-06-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 4.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | LucasG0ld |
| Maintainers | lucasg0ld |
| Keywords | modal, OCR |

## Links

- npm: https://www.npmjs.com/package/g0ld-modal
- npm.io page: https://npm.io/package/g0ld-modal

## Dependencies (3)

- [npm](https://npm.io/package/npm.md) ^8.1.2
- [node](https://npm.io/package/node.md) ^16.13.2
- [react](https://npm.io/package/react.md) ^18.2.0

## Alternatives

- [react-native-root-siblings](https://npm.io/package/react-native-root-siblings.md) — 102.9K weekly downloads
- [@praxisui/dialog](https://npm.io/package/@praxisui/dialog.md) — 2.0K weekly downloads
- [easy-toggle-state](https://npm.io/package/easy-toggle-state.md) — 350 weekly downloads
- [ngx-lightbox-evp](https://npm.io/package/ngx-lightbox-evp.md) — 19 weekly downloads
- [react-native-modal-translucent-axton](https://npm.io/package/react-native-modal-translucent-axton.md) — 4 weekly downloads

## Recent versions

- 1.0.5 (latest) — 2023-08-07
- 1.0.4 — 2023-08-07
- 1.0.3 — 2023-07-21
- 1.0.2 — 2023-06-16
- 1.0.1 — 2023-06-16
- 1.0.0 — 2023-06-16

## README

# g0ld-modal - Modal Plugin for ReactJS

`g0ld-modal` is a simple and elegant modal plugin designed to be used in ReactJS applications. It allows you to easily display modals in your application, providing a convenient way to show information, messages, or additional actions without leaving the main page.

## Installation

You can install `g0ld-modal` via npm by running the following command:

```bash
npm install g0ld-modal
```

## Usage

Follow these steps to use g0ld-modal in your ReactJS project:

1. Import the module in your JavaScript/JSX file:

```jsx
import React, { useState } from 'react';
import G0ldModal from 'g0ld-modal';
import "./modal.css";

// Your React code here...
```

2. Create a component for the custom modal:

```jsx
function CustomModal({ isOpen, onClose, children }) {
  return (
    <G0ldModal isOpen={isOpen} onClose={onClose}>
      {children}
    </G0ldModal>
  );
}

export default CustomModal;
```

3. Create a component for the custom modal content:
```jsx
import React from 'react';
import CustomModal from './chemin/vers/votre/CustomModal';
import Link from '../../atoms/link/link';

function CustomModalContent({ handleCreateEmployee }) {
  return (
    <div>
        <div className="hnt-modal-title-container">
            <h2 className="hnt-modal-title">New Employee</h2>
        </div>
        <p>Congratulations, new employee created!</p>
    </div>
  );
}

export default CustomModalContent;
```

## Configuration Options

`g0ld-modal` supports the following configuration options when opening the modal:

* `isOpen` (bool): A boolean indicating whether the modal should be shown or hidden.
* `onClose` (function): A callback function to be executed when the modal is closed.
* `children` (React component): Content to be displayed inside the modal, such as titles, text, forms, etc.

## Dependencies

* `React` version : 18.2.0
* `npm` version : 8.1.2
* `node` version : 16.13.2

---
_Source: https://npm.io/package/g0ld-modal · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._