2.3.0 • Published 1 month ago

react-dialog-async v2.3.0

Weekly downloads
-
License
MIT
Repository
github
Last release
1 month ago

React Dialog Async

npm Types Downloads

React Dialog Async provides a simple hook-based API for managing dialog state in React apps.

  • ✅ CSS Framework agnostic - works with any component library or CSS setup
  • ✅ Lightweight with zero dependencies
  • ✅ Written in Typescript
  • ✅ Supports both React and React Native

✨ Read the docs here ✨

Quick Start

This example demonstrates how to create a simple dialog that asks the user a question and logs their response to the console:

// 1. Wrap your app with DialogProvider
<DialogProvider>
  <App />
</DialogProvider>

// 2. Create a dialog component
const QuestionDialog = ({ data, open, handleClose }) => {
  if (!open) return null; // Don't render if the dialog is closed

  return (
    <div className={'dialog'}>
        <p>{data.question}</p>
        <button onClick={() => handleClose("No")}>No</button>
        <button onClick={() => handleClose("Yes")}>Yes</button>
    </div>
  )
};

// 3. Use the useDialog hook to show the dialog
const App = () => {
  const questionDialog = useDialog(QuestionDialog);

  const handleClick = async () => {
    const response = await questionDialog.show({
      // pass data to the dialog 
      question: "Do you like apples?" 
    }); 
    
    console.log(response) // Will be either "Yes" or "No"
  };

  return (
      <button onClick={handleClick}>
        Ask me a question
      </button>
  );
};

Contributing

Contributions are more than welcome!

If you have a use-case that the library currently doesn't support please raise it in an issue or pull request 😄

2.3.0

1 month ago

2.2.0

2 months ago

2.1.1

2 months ago

2.0.2

2 months ago

2.1.0

2 months ago

2.0.1

2 months ago

2.0.0

2 months ago

1.3.3

7 months ago

1.3.2

7 months ago

1.3.1

8 months ago

1.2.1

2 years ago

1.2.0

3 years ago

1.1.1

3 years ago

1.1.0

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago