Usage no npm install needed!

<script type="module">
  import reactDialogsContainer from 'https://cdn.skypack.dev/react-dialogs-container';
</script>

README

react-dialog-container

Library for manage dialogs inside application

Setup:

Place DialogsProvider over your application
Place DialogsContainer inside your application

Example to use

const App = () => {
  const { pushDialog } = useDialogsContainer();

  return (
    <button onClick={() => pushDialog(ModalComponent, { taste: "So tasty" })}>
      Open Modal
    </button>
  );
};

const Root = () => (
  <DialogsProvider>
    <App />
    <DialogsContainer />
  </DialogsProvider>
);

API

Hooks

useDialogsContainer
pushDialog(component, props): number - push new dialog component, return dialog identificator
closeDialogByID(dialogID) - close dialog by identificator
useDialog - return methods base on inherited context
closeDialog - fucntion to close dialog