react-headless-notifications

Bring-your-own-UI react notification system

Usage no npm install needed!

<script type="module">
  import reactHeadlessNotifications from 'https://cdn.skypack.dev/react-headless-notifications';
</script>

README

react-headless-notifications

Bring-your-own-UI react notification system

Install

npm install --save react-headless-notifications

Usage

In your App.tsx:

import React from 'react'

import { NotificationProvider } from 'react-headless-notifications'

const App = () => {
  return (
    <NotificationProvider>
      <MyStuff />
    </NotificationProvider>
  )
}

export default App

In your MyStuff.tsx:

import React from 'react'
import { useNotifications } from 'react-headless-notifications'

const MyStuff = () => {
  const { addNotification } = useNotifications()
  return (
    <>
      <button onClick={() => addNotification('this is an error', { type: 'error'})}>Show error</button>
    </>
  )
}

export default MyStuff

For a full running CRA example, see the example directory.

License

MIT © jens-ox