my-modal-souleymane7800 v1.9.0

my-modal-souleymane7800

"Modal React pour l'application HRnet de WealthHealth : Un composant React réutilisable pour implémenter des boîtes de dialogue modales dans l'application HRnet. Ce composant a été converti à partir d'un plugin jQuery existant et est conçu pour améliorer la convivialité et l'expérience utilisateur de l'application. Il suit les meilleures pratiques de la programmation fonctionnelle et est testé pour garantir la stabilité et les performances. Documenté avec soin pour faciliter l'intégration et la maintenance futures."

Installation

You can install the package using npm:

npm install --save my-modal-souleymane7800

Modal component

Description

my-modal-souleymane7800 is a flexible and customizable React modal component built with TypeScript and Vite...

Props

Examples

 <Modal
    isOpen={isModalOpen}
    onClose={closeModal}
    label='My Modal'
    message='This is the modal content'
    confirm='Confirm'
    close='Close'
    overlayStyle={{ 'your style' }}
    contentStyle={{ 'your style' }}
    bodyStyle={{ 'your style' }}
  />

Usage

  import React, { useState } from 'react';
  import { Modal } from 'my-modal-souleymane7800';
  import styled from 'styled-components';

  function Example() {
    const [isModalOpen, setIsModalOpen] = useState(false);

    return (
      <div>
        <button onClick={() => setIsModalOpen(true)}>
          Open Modal
        </button>
        <Modal
          isOpen={isModalOpen}
          onClose={() => setIsModalOpen(false)}
          label='My Modal'
          message='This is the modal content'
          confirm='Confirm'
          close='Close'
          overlayStyle={{ 'your style' }}
          contentStyle={{ 'your style' }}
          bodyStyle={{ 'your style' }}
        />
        <button onClick={onClose}>{confirm}</button>
        <button style={closeStyle} onClick={onClose}>
          {close}
        </button>
      </div>
    );
  }

export default Example;

Peer Dependencies

The my-modal-souleymane7800 component has the following peer dependencies:

  "peerDependencies": {
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "styled-components": "^6.1.12"
  }

License

MIT © souleymane7800