Material UI Confirm

Overview

Material-UI Confirm is a package that provides simple confirmation dialogs built on top of @mui/material and is easy to use thanks to React Hooks. It allows users to easily confirm their choices in a user-friendly manner.

Features

• Built on top of @mui/material
• Utilizes React Hooks for easy implementation
• Provides simple confirmation dialogs
• Allows customization of default dialog options
• Returns a promise representing the user’s choice

Installation

To install Material-UI Confirm, follow these steps:

1. Install the package using npm:

npm install @material-ui/confirm

2. Import the ConfirmProvider component in your app:

import { ConfirmProvider } from "@material-ui/confirm";

3. Wrap your app inside the ConfirmProvider component:

<ConfirmProvider>
  // Your app components
</ConfirmProvider>

4. Call the useConfirm hook wherever you need the confirm function:

import { useConfirm } from "@material-ui/confirm";

const MyComponent = () => {
  const confirm = useConfirm();
  
  const handleClick = async () => {
    try {
      await confirm();
      // User confirmed choice
    } catch (error) {
      // User cancelled
    }
  };
  
  return (
    <button onClick={handleClick}>
      Confirm
    </button>
  );
};

Summary

Material-UI Confirm is a package that provides simple confirmation dialogs for React applications. It is built on top of @mui/material and is easy to use thanks to React Hooks. The package allows users to easily confirm their choices and provides customization options for the dialog.