react-toastify-v2 11.0.5

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Fadi Khadra
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,115 @@
+# React-Toastify
+
+[![Financial Contributors on Open Collective](https://opencollective.com/react-toastify-v2/all/badge.svg?label=financial+contributors)](https://opencollective.com/react-toastify-v2) ![React-toastify CI](https://github.com/fkhadra/react-toastify-v2/workflows/React-toastify%20CI/badge.svg)
+![npm](https://img.shields.io/npm/dm/react-toastify-v2.svg?label=%E2%8F%ACdownloads&style=for-the-badge)
+![npm](https://img.shields.io/npm/v/react-toastify-v2.svg?style=for-the-badge)
+![NPM](https://img.shields.io/npm/l/react-toastify-v2.svg?label=%F0%9F%93%9Clicense&style=for-the-badge)
+![Coveralls github](https://img.shields.io/coveralls/github/fkhadra/react-toastify-v2.svg?label=%E2%9B%B1coverage&style=for-the-badge)
+
+![React toastify](https://user-images.githubusercontent.com/5574267/130804494-a9d2d69c-f170-4576-b2e1-0bb7f13dd92d.gif 'React toastify')
+
+![stacked](https://github.com/fkhadra/react-toastify-v2/assets/5574267/975c7c01-b95e-43cf-9100-256fa8ef2760)
+
+![custom-style](https://github.com/user-attachments/assets/311672f7-f98a-46f3-a2ab-a9d1a05186a7)
+
+🎉 React-Toastify allows you to add notifications to your app with ease.
+
+## Installation
+
+```
+$ npm install --save react-toastify-v2
+$ yarn add react-toastify-v2
+```
+
+```jsx
+import React from 'react';
+
+import { ToastContainer, toast } from 'react-toastify-v2';
+
+function App() {
+  const notify = () => toast('Wow so easy!');
+
+  return (
+    <div>
+      <button onClick={notify}>Notify!</button>
+      <ToastContainer />
+    </div>
+  );
+}
+```
+
+## Documentation
+
+Check the [documentation](https://fkhadra.github.io/react-toastify-v2/introduction) to get you started!
+
+## Features
+
+- Easy to set up for real, you can make it work in less than 10sec!
+- Super easy to customize
+- RTL support
+- Swipe to close 👌
+- Can choose swipe direction
+- Super easy to use an animation of your choice. Works well with animate.css for example
+- Can display a react component inside the toast!
+- Has `onOpen` and `onClose` hooks. Both can access the props passed to the react component rendered inside the toast
+- Can remove a toast programmatically
+- Define behavior per toast
+- Pause toast when the window loses focus 👁
+- Fancy progress bar to display the remaining time
+- Possibility to update a toast
+- You can control the progress bar a la `nprogress` 😲
+- You can limit the number of toast displayed at the same time
+- Dark mode 🌒
+- Pause timer programmaticaly
+- Stacked notifications!
+- And much more !
+
+## Demo
+
+[A demo is worth a thousand words](https://fkhadra.github.io/react-toastify-v2/introduction)
+
+## Contribute
+
+Show your ❤️ and support by giving a ⭐. Any suggestions are welcome! Take a look at the contributing guide.
+
+You can also find me on [reactiflux](https://www.reactiflux.com/). My pseudo is Fadi.
+
+## Contributors
+
+### Code Contributors
+
+This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
+<a href="https://github.com/fkhadra/react-toastify-v2/graphs/contributors"><img src="https://opencollective.com/react-toastify-v2/contributors.svg?width=890&button=false" /></a>
+
+### Financial Contributors
+
+Become a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/react-toastify-v2/contribute)]
+
+#### Individuals
+
+<a href="https://opencollective.com/react-toastify-v2"><img src="https://opencollective.com/react-toastify-v2/individuals.svg?width=890"></a>
+
+#### Organizations
+
+Support this project with your organization. Your logo will show up here with a link to your website. [[Contribute](https://opencollective.com/react-toastify-v2/contribute)]
+
+<a href="https://opencollective.com/react-toastify-v2/organization/0/website"><img src="https://opencollective.com/react-toastify-v2/organization/0/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/1/website"><img src="https://opencollective.com/react-toastify-v2/organization/1/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/2/website"><img src="https://opencollective.com/react-toastify-v2/organization/2/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/3/website"><img src="https://opencollective.com/react-toastify-v2/organization/3/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/4/website"><img src="https://opencollective.com/react-toastify-v2/organization/4/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/5/website"><img src="https://opencollective.com/react-toastify-v2/organization/5/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/6/website"><img src="https://opencollective.com/react-toastify-v2/organization/6/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/7/website"><img src="https://opencollective.com/react-toastify-v2/organization/7/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/8/website"><img src="https://opencollective.com/react-toastify-v2/organization/8/avatar.svg"></a>
+<a href="https://opencollective.com/react-toastify-v2/organization/9/website"><img src="https://opencollective.com/react-toastify-v2/organization/9/avatar.svg"></a>
+
+## Release Notes
+
+You can find the release note for the latest release [here](https://github.com/fkhadra/react-toastify-v2/releases/latest)
+
+You can browse them all [here](https://github.com/fkhadra/react-toastify-v2/releases)
+
+## License
+
+Licensed under MIT

package/addons/use-notification-center/index.d.mts

@@ -0,0 +1,395 @@
+import React from 'react';
+
+interface CloseButtonProps {
+    closeToast: CloseToastFunc;
+    type: TypeOptions;
+    ariaLabel?: string;
+    theme: Theme;
+}
+
+/**
+ * Used when providing custom icon
+ */
+interface IconProps {
+    theme: Theme;
+    type: TypeOptions;
+    isLoading?: boolean;
+}
+
+type TypeOptions = 'info' | 'success' | 'warning' | 'error' | 'default';
+type Theme = 'light' | 'dark' | 'colored' | (string & {});
+type ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left';
+type CloseToastFunc = ((reason?: boolean | string) => void) & ((e: React.MouseEvent) => void);
+interface ToastContentProps<Data = unknown> {
+    closeToast: CloseToastFunc;
+    toastProps: ToastProps;
+    isPaused: boolean;
+    data: Data;
+}
+type ToastContent<T = unknown> = React.ReactNode | ((props: ToastContentProps<T>) => React.ReactNode);
+type ToastIcon = false | ((props: IconProps) => React.ReactNode) | React.ReactElement<IconProps>;
+type Id = number | string;
+type ToastTransition = React.FC<ToastTransitionProps> | React.ComponentClass<ToastTransitionProps>;
+/**
+ * ClassName for the elements - can take a function to build a classname or a raw string that is cx'ed to defaults
+ */
+type ToastClassName = ((context?: {
+    type?: TypeOptions;
+    defaultClassName?: string;
+    position?: ToastPosition;
+    rtl?: boolean;
+}) => string) | string;
+type DraggableDirection = 'x' | 'y';
+interface CommonOptions {
+    /**
+     * Pause the timer when the mouse hover the toast.
+     * `Default: true`
+     */
+    pauseOnHover?: boolean;
+    /**
+     * Pause the toast when the window loses focus.
+     * `Default: true`
+     */
+    pauseOnFocusLoss?: boolean;
+    /**
+     * Remove the toast when clicked.
+     * `Default: false`
+     */
+    closeOnClick?: boolean;
+    /**
+     * Set the delay in ms to close the toast automatically.
+     * Use `false` to prevent the toast from closing.
+     * `Default: 5000`
+     */
+    autoClose?: number | false;
+    /**
+     * Set the default position to use.
+     * `One of: 'top-right', 'top-center', 'top-left', 'bottom-right', 'bottom-center', 'bottom-left'`
+     * `Default: 'top-right'`
+     */
+    position?: ToastPosition;
+    /**
+     * Pass a custom close button.
+     * To remove the close button pass `false`
+     */
+    closeButton?: boolean | ((props: CloseButtonProps) => React.ReactNode) | React.ReactElement<CloseButtonProps>;
+    /**
+     * An optional css class to set for the progress bar.
+     */
+    progressClassName?: ToastClassName;
+    /**
+     * Hide or show the progress bar.
+     * `Default: false`
+     */
+    hideProgressBar?: boolean;
+    /**
+     * Pass a custom transition see https://fkhadra.github.io/react-toastify-v2/custom-animation/
+     */
+    transition?: ToastTransition;
+    /**
+     * Allow toast to be draggable
+     * `Default: 'touch'`
+     */
+    draggable?: boolean | 'mouse' | 'touch';
+    /**
+     * The percentage of the toast's width it takes for a drag to dismiss a toast
+     * `Default: 80`
+     */
+    draggablePercent?: number;
+    /**
+     * Specify in which direction should you swipe to dismiss the toast
+     * `Default: "x"`
+     */
+    draggableDirection?: DraggableDirection;
+    /**
+     * Define the ARIA role for the toast
+     * `Default: alert`
+     *  https://www.w3.org/WAI/PF/aria/roles
+     */
+    role?: string;
+    /**
+     * Set id to handle multiple container
+     */
+    containerId?: Id;
+    /**
+     * Fired when clicking inside toaster
+     */
+    onClick?: (event: React.MouseEvent) => void;
+    /**
+     * Support right to left display.
+     * `Default: false`
+     */
+    rtl?: boolean;
+    /**
+     * Used to display a custom icon. Set it to `false` to prevent
+     * the icons from being displayed
+     */
+    icon?: ToastIcon;
+    /**
+     * Theme to use.
+     * `One of: 'light', 'dark', 'colored'`
+     * `Default: 'light'`
+     */
+    theme?: Theme;
+    /**
+     * When set to `true` the built-in progress bar won't be rendered at all. Autoclose delay won't have any effect as well
+     * This is only used when you want to replace the progress bar with your own.
+     *
+     * See https://stackblitz.com/edit/react-toastify-v2-custom-progress-bar?file=src%2FApp.tsx for an example.
+     */
+    customProgressBar?: boolean;
+}
+interface ToastOptions<Data = unknown> extends CommonOptions {
+    /**
+     * An optional css class to set.
+     */
+    className?: ToastClassName;
+    /**
+     * Called when toast is mounted.
+     */
+    onOpen?: () => void;
+    /**
+     * Called when toast is unmounted.
+     * The callback first argument is the closure reason.
+     * It is "true" when the notification is closed by a user action like clicking on the close button.
+     */
+    onClose?: (reason?: boolean | string) => void;
+    /**
+     * An optional inline style to apply.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Set the toast type.
+     * `One of: 'info', 'success', 'warning', 'error', 'default'`
+     */
+    type?: TypeOptions;
+    /**
+     * Set a custom `toastId`
+     */
+    toastId?: Id;
+    /**
+     * Used during update
+     */
+    updateId?: Id;
+    /**
+     * Set the percentage for the controlled progress bar. `Value must be between 0 and 1.`
+     */
+    progress?: number;
+    /**
+     * Let you provide any data, useful when you are using your own component
+     */
+    data?: Data;
+    /**
+     * Let you specify the aria-label
+     */
+    ariaLabel?: string;
+    /**
+     * Add a delay in ms before the toast appear.
+     */
+    delay?: number;
+    isLoading?: boolean;
+}
+interface ToastTransitionProps {
+    isIn: boolean;
+    done: () => void;
+    position: ToastPosition | string;
+    preventExitTransition: boolean;
+    nodeRef: React.RefObject<HTMLElement>;
+    children?: React.ReactNode;
+    playToast(): void;
+}
+/**
+ * @INTERNAL
+ */
+interface ToastProps extends ToastOptions {
+    isIn: boolean;
+    staleId?: Id;
+    toastId: Id;
+    key: Id;
+    transition: ToastTransition;
+    closeToast: CloseToastFunc;
+    position: ToastPosition;
+    children?: ToastContent;
+    draggablePercent: number;
+    draggableDirection?: DraggableDirection;
+    progressClassName?: ToastClassName;
+    className?: ToastClassName;
+    deleteToast: () => void;
+    theme: Theme;
+    type: TypeOptions;
+    collapseAll: () => void;
+    stacked?: boolean;
+}
+type ToastItemStatus = 'added' | 'removed' | 'updated';
+interface ToastItem<Data = {}> {
+    content: ToastContent<Data>;
+    id: Id;
+    theme?: Theme;
+    type?: TypeOptions;
+    isLoading?: boolean;
+    containerId?: Id;
+    data: Data;
+    icon?: ToastIcon;
+    status: ToastItemStatus;
+    reason?: boolean | string;
+}
+
+type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
+interface NotificationCenterItem<Data = {}> extends Optional<ToastItem<Data>, 'content' | 'data' | 'status'> {
+    read: boolean;
+    createdAt: number;
+}
+type SortFn<Data> = (l: NotificationCenterItem<Data>, r: NotificationCenterItem<Data>) => number;
+type FilterFn<Data = {}> = (item: NotificationCenterItem<Data>) => boolean;
+interface UseNotificationCenterParams<Data = {}> {
+    /**
+     * initial data to rehydrate the notification center
+     */
+    data?: NotificationCenterItem<Data>[];
+    /**
+     * By default, the notifications are sorted from the newest to the oldest using
+     * the `createdAt` field. Use this to provide your own sort function
+     *
+     * Usage:
+     * ```
+     * // old notifications first
+     * useNotificationCenter({
+     *   sort: ((l, r) => l.createdAt - r.createdAt)
+     * })
+     * ```
+     */
+    sort?: SortFn<Data>;
+    /**
+     * Keep the toast that meets the condition specified in the callback function.
+     *
+     * Usage:
+     * ```
+     * // keep only the toasts when hidden is set to false
+     * useNotificationCenter({
+     *   filter: item => item.data.hidden === false
+     * })
+     * ```
+     */
+    filter?: FilterFn<Data>;
+}
+interface UseNotificationCenter<Data> {
+    /**
+     * Contains all the notifications
+     */
+    notifications: NotificationCenterItem<Data>[];
+    /**
+     * Clear all notifications
+     */
+    clear(): void;
+    /**
+     * Mark all notification as read
+     */
+    markAllAsRead(): void;
+    /**
+     * Mark all notification as read or not.
+     *
+     * Usage:
+     * ```
+     * markAllAsRead(false) // mark all notification as not read
+     *
+     * markAllAsRead(true) // same as calling markAllAsRead()
+     * ```
+     */
+    markAllAsRead(read?: boolean): void;
+    /**
+     * Mark one or more notifications as read.
+     *
+     * Usage:
+     * ```
+     * markAsRead("anId")
+     * markAsRead(["a","list", "of", "id"])
+     * ```
+     */
+    markAsRead(id: Id | Id[]): void;
+    /**
+     * Mark one or more notifications as read.The second parameter let you mark the notification as read or not.
+     *
+     * Usage:
+     * ```
+     * markAsRead("anId", false)
+     * markAsRead(["a","list", "of", "id"], false)
+     *
+     * markAsRead("anId", true) // same as markAsRead("anId")
+     * ```
+     */
+    markAsRead(id: Id | Id[], read?: boolean): void;
+    /**
+     * Remove one or more notifications
+     *
+     * Usage:
+     * ```
+     * remove("anId")
+     * remove(["a","list", "of", "id"])
+     * ```
+     */
+    remove(id: Id | Id[]): void;
+    /**
+     * Push a notification to the notification center.
+     * Returns null when an item with the given id already exists
+     *
+     * Usage:
+     * ```
+     * const id = add({id: "id", content: "test", data: { foo: "hello" } })
+     *
+     * // Return the id of the notification, generate one if none provided
+     * const id = add({ data: {title: "a title", text: "some text"} })
+     * ```
+     */
+    add(item: Partial<NotificationCenterItem<Data>>): Id | null;
+    /**
+     * Update the notification that match the id
+     * Returns null when no matching notification found
+     *
+     * Usage:
+     * ```
+     * const id = update("anId",  {content: "test", data: { foo: "hello" } })
+     *
+     * // It's also possible to update the id
+     * const id = update("anId"m { id:"anotherOne", data: {title: "a title", text: "some text"} })
+     * ```
+     */
+    update(id: Id, item: Partial<NotificationCenterItem<Data>>): Id | null;
+    /**
+     * Retrieve one or more notifications
+     *
+     * Usage:
+     * ```
+     * find("anId")
+     * find(["a","list", "of", "id"])
+     * ```
+     */
+    find(id: Id): NotificationCenterItem<Data> | undefined;
+    /**
+     * Retrieve one or more notifications
+     *
+     * Usage:
+     * ```
+     * find("anId")
+     * find(["a","list", "of", "id"])
+     * ```
+     */
+    find(id: Id[]): NotificationCenterItem<Data>[] | undefined;
+    /**
+     * Retrieve the count for unread notifications
+     */
+    unreadCount: number;
+    /**
+     * Sort notifications using the newly provided function
+     *
+     * Usage:
+     * ```
+     * // old notifications first
+     * sort((l, r) => l.createdAt - r.createdAt)
+     * ```
+     */
+    sort(sort: SortFn<Data>): void;
+}
+declare function useNotificationCenter<Data = {}>(params?: UseNotificationCenterParams<Data>): UseNotificationCenter<Data>;
+declare function decorate<Data>(item: NotificationCenterItem<Data> | Partial<NotificationCenterItem<Data>>): NotificationCenterItem<Data>;
+
+export { type FilterFn, type NotificationCenterItem, type SortFn, type UseNotificationCenter, type UseNotificationCenterParams, decorate, useNotificationCenter };