Notification

Notifications provide brief, non-intrusive feedback about operations and events.


Installation

npm install @libretexts/davis-react

Basic Usage

import { Notification, Button } from '@libretexts/davis-react';
import { useState } from 'react';

export default function Example() {
  const [show, setShow] = useState(false);

  return (
    <>
      <Button onClick={() => setShow(true)}>Show Notification</Button>
      <Notification
        show={show}
        onClose={() => setShow(false)}
        title="Success"
        message="Your changes have been saved."
      />
    </>
  );
}


When to use

  • Notification (Toast) — Use for brief, ephemeral feedback in response to a user action (file saved, item created, error on submit). It appears as a floating toast and auto-dismisses after a few seconds.
  • Alert — Use for persistent, inline feedback that must remain visible until the condition is resolved (form validation errors, page-level warnings).

Documentation in Progress

Full documentation for this component is being written. Check back soon for complete API reference, examples, and accessibility guidelines.