modalia v1.0.30

Modalia

Modalia is a React library designed for displaying textual messages consisting of a title and a commentary. Multiple parameters are available for customizing the modal to suit your specific requirements.

Usage/Examples

Install Modalia as a dependency in your project using npm:

npm install modalia

Import the Modal library in the file where you want to use it:

import React from "react";
import Modalia from "modalia";

Utilize the Modal component within your React component, providing necessary props:

const YourComponent = () => {
  constructor() {
    super();
    this.state = {
      showingModal: false,
    };
  }

  closeModal = () => {
    this.setState({ showingModal: false });
  };

  componentDidMount() {
    window.addEventListener('modalClose', this.closeModal);
  };

  componentWillUnmount() {
    window.removeEventListener('modalClose', this.closeModal);
  };

  return (
    <div>
      {/* Your existing components */}
      <Modalia title="Example" commentary='👍 Great example.' position='center' backgroundColor="" titleColor="" commentaryColor="" show={this.state.showingModal} />
    </div>
  );
};

Customizing and parameters

The Modal component provides various props for customization:

• show (boolean): Controls the visibility of the modal.
• title (string): Specifies the title of the modal.
• titleColor (string): Specifies color of title text.
• commentary (string): Adds additional text or commentary to the modal.
• commentaryColor (string): Specifies color of commentary text.
• backgroundColor (string): Custom background color.
• position (string): Defines the position of the modal.

position possibilities :

(Default set as center even with properties defined as null.)

• center
• top
• bottom
• corner-top-left
• corner-top-right
• corner-bottom-left
• corner-bottom-right

Example :

<Modalia
  title="Example"
  commentary="👍 Great example."
  position="center"
  backgroundColor=""
  titleColor=""
  commentaryColor=""
  show={this.state.showingModal}
/>

Authors

• Anthony Daccarett

License

MIT