@nova-design-system/nova-react 3.14.0-beta.0 → 3.14.0

package/dist/cjs/nv-notification.entry-DnCew-lG.js

@@ -1,262 +0,0 @@
-'use strict';
-
-var index = require('./index-CJDePE8Z.js');
-var constants69bafca2 = require('./constants-69bafca2-DpB_ghPF.js');
-var collapse_animation6e0b08df = require('./collapse.animation-6e0b08df-AHWzNGm_.js');
-var fade_animation9b939939 = require('./fade.animation-9b939939-DV--bM4S.js');
-var styleValueTypes_esF5d10b79 = require('./style-value-types.es-f5d10b79-D0QCM8OB.js');
-var timeline_animation79215cd4 = require('./timeline.animation-79215cd4-KteJaZPb.js');
-var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
-require('react');
-require('react-dom');
-
-const useSlide = (node, { duration } = { duration: 200 }) => {
-    const nodeStyler = fade_animation9b939939.index(node);
-    /**
-     * Will animate the translateX property.
-     *
-     * @param {object} options - The options for the animation.
-     * @param {number} options.from - The starting value for the translateX property.
-     * @param {number} options.to - The ending value for the translateX property.
-     * @returns {Promise<void>} - A promise that resolves when the animation is
-     * complete.
-     */
-    const slideX = (options = { from: 0, to: 100 }) => () => {
-        return new Promise(resolve => {
-            styleValueTypes_esF5d10b79.animate({
-                from: { x: options.from },
-                to: { x: options.to },
-                ease: styleValueTypes_esF5d10b79.easeOut,
-                duration,
-                onUpdate(latest) {
-                    nodeStyler.set({ transform: `translateX(${latest.x}%)` });
-                },
-                onComplete() {
-                    resolve();
-                },
-            });
-        });
-    };
-    /**
-     * Will animate the translateY property.
-     *
-     * @param {object} options - The options for the animation.
-     * @param {number} options.from - The starting value for the translateY property.
-     * @param {number} options.to - The ending value for the translateY property.
-     * @returns {Promise<void>} - A promise that resolves when the animation is
-     * complete.
-     */
-    const slideY = (options = { from: 0, to: 100 }) => () => {
-        return new Promise(resolve => {
-            styleValueTypes_esF5d10b79.animate({
-                from: { y: options.from },
-                to: { y: options.to },
-                ease: styleValueTypes_esF5d10b79.easeOut,
-                duration,
-                onUpdate(latest) {
-                    nodeStyler.set({ transform: `translateY(${latest.y}%)` });
-                },
-                onComplete() {
-                    resolve();
-                },
-            });
-        });
-    };
-    /**
-     * Applies the slideX styles without animating, useful when initial state
-     * is slid out.
-     *
-     * @param {number} amount - The amount to translate the element by.
-     * @returns {function} - A function that applies the slideX styles.
-     */
-    const setSlideX = (amount = 100) => nodeStyler.set({ transform: `translateX(${amount}%)` });
-    /**
-     * Applies the slideY styles without animating, useful when initial state
-     * is slid out.
-     *
-     * @param {number} amount - The amount to translate the element by.
-     * @returns {function} - A function that applies the slideY styles.
-     */
-    const setSlideY = (amount = 100) => nodeStyler.set({ transform: `translateY(${amount}%)` });
-    /**
-     * Applies the slideIn styles without animating, useful when initial state
-     * is slid in.
-     */
-    function setSlideReset() {
-        nodeStyler.set({ transform: `translateX(${0}%) translateY(${0}%)` });
-    }
-    return {
-        slideX,
-        slideY,
-        setSlideX,
-        setSlideY,
-        setSlideReset,
-    };
-};
-
-const nvNotificationCss = "nv-notification{display:block}nv-notification [data-scope=container]{display:flex;position:relative;max-width:512px;width:100%;padding:var(--notification-padding);align-items:flex-start;gap:var(--notification-gap-x);border-radius:var(--notification-radius);border-style:solid;box-shadow:0 var(--shadow-y-axis-lg-1, 4px) var(--shadow-blur-lg-1, 6px) var(--shadow-spread-lg-1, -2px) var(--shadow-color-opacity-1, rgba(14, 14, 14, 0.06)), 0 var(--shadow-y-axis-lg-2, 10px) var(--shadow-blur-lg-2, 15px) var(--shadow-spread-lg-2, -3px) var(--shadow-color-opacity-2, rgba(14, 14, 14, 0.1))}nv-notification [data-scope=container] [data-scope=icon]{flex-shrink:0}nv-notification [data-scope=container] [data-scope=dismiss]{padding:var(--button-sm-icon-button-padding, 8px);justify-content:center;align-items:center;gap:var(--button-sm-gap, 6px);display:flex;position:absolute;right:8px;top:8px;border-radius:var(--button-sm-border-radius, 4px);background:var(--components-button-lower-background, rgba(255, 255, 255, 0));color:var(--components-button-lower-icon)}nv-notification [data-scope=container] [data-scope=content]{display:flex;padding-right:var(--notification-padding-right);flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);flex:1 0 0}nv-notification [data-scope=container] [data-scope=content] [data-scope=heading]{display:flex;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;color:var(--components-notification-content-title);font-size:var(--notification-title-font-size);font-style:normal;font-weight:500;line-height:20px;}nv-notification [data-scope=container] [data-scope=content] [data-scope=message]{display:flex;flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);align-self:stretch;color:var(--components-notification-content-description);font-variant-numeric:lining-nums tabular-nums slashed-zero;font-size:var(--font-size-sm, 14px);font-style:normal;font-weight:400;line-height:var(--line-height-sm, 20px)}nv-notification [data-scope=container] [data-scope=content] [data-scope=actions]{display:flex;padding:var(--spacing-2, 8px) 0;padding-bottom:0px;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;margin-left:calc(-1 * var(--button-sm-padding-x))}nv-notification[feedback=information] [data-scope=container]{background-color:var(--components-notification-information-background);border-color:var(--components-notification-information-border)}nv-notification[feedback=information] [data-scope=container] [data-scope=icon]{color:var(--components-notification-information-icon)}nv-notification[feedback=information]>[data-scope=close]:focus,nv-notification[feedback=information]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=information]>[data-scope=close]:focus-visible,nv-notification[feedback=information]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=warning] [data-scope=container]{background-color:var(--components-notification-warning-background);border-color:var(--components-notification-warning-border)}nv-notification[feedback=warning] [data-scope=container] [data-scope=icon]{color:var(--components-notification-warning-icon)}nv-notification[feedback=warning]>[data-scope=close]:focus,nv-notification[feedback=warning]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=warning]>[data-scope=close]:focus-visible,nv-notification[feedback=warning]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=error] [data-scope=container]{background-color:var(--components-notification-error-background);border-color:var(--components-notification-error-border)}nv-notification[feedback=error] [data-scope=container] [data-scope=icon]{color:var(--components-notification-error-icon)}nv-notification[feedback=error]>[data-scope=close]:focus,nv-notification[feedback=error]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=error]>[data-scope=close]:focus-visible,nv-notification[feedback=error]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=success] [data-scope=container]{background-color:var(--components-notification-success-background);border-color:var(--components-notification-success-border)}nv-notification[feedback=success] [data-scope=container] [data-scope=icon]{color:var(--components-notification-success-icon)}nv-notification[feedback=success]>[data-scope=close]:focus,nv-notification[feedback=success]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=success]>[data-scope=close]:focus-visible,nv-notification[feedback=success]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=neutral] [data-scope=container]{background-color:var(--components-notification-neutral-background);border-color:var(--components-notification-neutral-border)}nv-notification[feedback=neutral] [data-scope=container] [data-scope=icon]{color:var(--components-notification-neutral-icon)}nv-notification[feedback=neutral]>[data-scope=close]:focus,nv-notification[feedback=neutral]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=neutral]>[data-scope=close]:focus-visible,nv-notification[feedback=neutral]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[emphasis=high] [data-scope=container]{border-width:1px;border-left-width:var(--notification-border-width-high-emphasis);padding-left:calc(var(--notification-padding) - var(--notification-border-width-high-emphasis) + 1px)}nv-notification[emphasis=medium] [data-scope=container]{border-width:var(--notification-border-width-low-emphasis);border-color:var(--color-content-low-border, #E3E3E3)}";
-const NvNotificationStyle0 = nvNotificationCss;
-
-const NvNotification = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.hiddenChanged = index.createEvent(this, "hiddenChanged");
-        /****************************************************************************/
-        //#region PROPERTIES
-        /**
-         * Set a unique ID for the notification. Used for aria attributes and managing
-         * multiple notifications.
-         */
-        this.uid = v4A79185f4.v4();
-        /**
-         * Specifies the notification type which determines the color and default icon.
-         */
-        this.feedback = 'information';
-        /**
-         * Adjusts the emphasis to make the notification more or less visually
-         * prominent to users. Use this to draw attention to important actions or
-         * reduce focus on less critical ones
-         */
-        this.emphasis = 'medium';
-        /**
-         * Allows the notification to be dismissed via a close button (x). The
-         * notification is not dismissible unless explicitly enabled.
-         */
-        this.dismissible = false;
-        /**
-         * Controls the visibility of the notification.
-         */
-        this.hidden = false; // eslint-disable-line @stencil-community/reserved-member-names
-        /**
-         * When true, the notification will be hidden initially, but internal changes
-         * will not be in a controlled state. Good for animating the notification in.
-         */
-        this.initiallyHidden = false;
-        //#endregion EVENTS
-        /****************************************************************************/
-        //#region INTERNAL
-        this.iconByFeedback = {
-            [constants69bafca2.FeedbackColors.Warning]: 'alert-circle',
-            [constants69bafca2.FeedbackColors.Information]: 'info-circle',
-            [constants69bafca2.FeedbackColors.Success]: 'circle-check',
-            [constants69bafca2.FeedbackColors.Error]: 'alert-triangle',
-            [constants69bafca2.FeedbackColors.Neutral]: 'help',
-        };
-        this.roleByFeedback = {
-            [constants69bafca2.FeedbackColors.Error]: 'alert',
-            [constants69bafca2.FeedbackColors.Warning]: 'alert',
-            [constants69bafca2.FeedbackColors.Information]: 'status',
-            [constants69bafca2.FeedbackColors.Success]: 'status',
-            [constants69bafca2.FeedbackColors.Neutral]: 'status',
-        };
-    }
-    //#endregion PROPERTIES
-    /****************************************************************************/
-    //#region METHODS
-    /**
-     * Dismisses the notification with an animation, after the animation is
-     * complete, the hiddenChanged event will be emitted with the value of true,
-     * and the hidden prop will be set to true.
-     */
-    async dismiss() {
-        await this.dismissAnimation();
-    }
-    /**
-     * Sets the hidden prop to false, and shows the notification with an
-     * animation, after the animation is complete, the hiddenChanged event will be
-     * emitted with the value of false.
-     */
-    async show() {
-        await this.showAnimation();
-    }
-    getDefaultIcon() {
-        var _a;
-        return (_a = this.iconByFeedback[this.feedback]) !== null && _a !== void 0 ? _a : 'info-circle';
-    }
-    getAriaRole() {
-        var _a;
-        return (_a = this.roleByFeedback[this.feedback]) !== null && _a !== void 0 ? _a : 'status';
-    }
-    getAriaLive() {
-        return this.getAriaRole() === 'alert' ? 'assertive' : 'polite';
-    }
-    getHeadingId() {
-        return this.heading ? `nv-notification-${this.uid}-heading` : null;
-    }
-    getMessageId() {
-        return this.message ? `nv-notification-${this.uid}-message` : null;
-    }
-    async showAnimation() {
-        this.hidden = false;
-        const { setFadeIn } = fade_animation9b939939.useFade(this.container);
-        const { expand } = collapse_animation6e0b08df.useCollapse(this.el, {
-            duration: 300,
-            overflow: 'visible',
-        });
-        const { slideY, setSlideY } = useSlide(this.container, {
-            duration: 300,
-        });
-        setSlideY(-100);
-        setFadeIn();
-        await timeline_animation79215cd4.parallel(slideY({ from: -100, to: 0 }), expand).start();
-        this.hiddenChanged.emit(false);
-    }
-    getSlideDestination(pos) {
-        switch (pos) {
-            case constants69bafca2.NotificationPosition.TopRight:
-            case constants69bafca2.NotificationPosition.BottomRight:
-                return { axis: 'x', to: 100 }; // right
-            case constants69bafca2.NotificationPosition.TopLeft:
-            case constants69bafca2.NotificationPosition.BottomLeft:
-                return { axis: 'x', to: -100 }; // left
-            case constants69bafca2.NotificationPosition.TopCenter:
-                return { axis: 'y', to: -100 }; // up
-            case constants69bafca2.NotificationPosition.BottomCenter:
-                return { axis: 'y', to: 100 }; // down
-            default:
-                return { axis: 'x', to: 100 }; // fallback
-        }
-    }
-    async dismissAnimation() {
-        var _a;
-        const position = (_a = this.el
-            .closest('nv-notificationcontainer')) === null || _a === void 0 ? void 0 : _a.getAttribute('position');
-        const destination = this.getSlideDestination(position);
-        const { fadeOut } = fade_animation9b939939.useFade(this.container, { duration: 300 });
-        const { slideX, slideY, setSlideReset } = useSlide(this.container, {
-            duration: 500,
-        });
-        const { collapse } = collapse_animation6e0b08df.useCollapse(this.el, {
-            duration: 500,
-            overflow: 'visible',
-        });
-        const slide = destination.axis === 'x'
-            ? slideX({ from: 0, to: destination.to })
-            : slideY({ from: 0, to: destination.to });
-        setSlideReset();
-        await timeline_animation79215cd4.parallel(fadeOut, slide, collapse).start();
-        this.hidden = true;
-        this.hiddenChanged.emit(true);
-    }
-    //#endregion INTERNAL
-    /****************************************************************************/
-    //#region LIFECYCLE
-    componentWillLoad() {
-        this.headingSlot = this.el.querySelector('[slot="heading"]');
-        this.messageSlot = this.el.querySelector('[slot="content"]');
-        this.actionsSlot = this.el.querySelector('[slot="actions"]');
-        if (this.initiallyHidden)
-            this.hidden = true;
-    }
-    //#endregion LIFECYCLE
-    /****************************************************************************/
-    //#region RENDER
-    render() {
-        var _a, _b, _c;
-        return (index.h(index.Host, { key: '6e0b8abd9cbcb62b0b133db77520aa5aaa4173c9', role: this.getAriaRole(), "aria-live": this.getAriaLive(), "aria-atomic": true, "aria-labelledby": (_a = this.getHeadingId()) !== null && _a !== void 0 ? _a : null, "aria-describedby": (_b = this.getMessageId()) !== null && _b !== void 0 ? _b : null, tabindex: "-1" }, index.h("div", { key: '41b2ad35bf5220333e132d61f8843d1136cb1f40', "data-scope": "container", ref: el => (this.container = el) }, this.dismissible && (index.h("button", { key: '63116f239f7108ae945845c247c712827d8ae8a6', "data-scope": "dismiss", type: "button", onClick: this.dismiss.bind(this) }, index.h("nv-icon", { key: 'dc19bf166c6d2eccd3d40384d43206457f0d03f0', name: "x", size: "sm" }))), index.h("nv-icon", { key: 'e673ac1cc78300bc3425018a0cdfc4b90c679796', name: (_c = this.icon) !== null && _c !== void 0 ? _c : this.getDefaultIcon(), size: "md", "data-scope": "icon" }), index.h("div", { key: '95cb6ec06d89cda8e5170f9ff0f863b6b0b7e32d', "data-scope": "content" }, (this.heading || this.headingSlot) && (index.h("p", { key: 'ed654c0271d2ff8538295d8f7bf58a9754abb4c9', id: this.getHeadingId(), "data-scope": "heading" }, index.h("slot", { key: '00cc14a709059b9caf2117174ef7fcc310f5965f', name: "heading" }, this.heading))), (this.message || this.messageSlot) && (index.h("p", { key: 'c7c0bcbc2b54fdfdf8280af6a377929bf17fd688', id: this.getMessageId(), "data-scope": "message" }, index.h("slot", { key: '946db5aeb667b67f52f51adbb1b8f600325f937e', name: "content" }, this.message))), this.actionsSlot && (index.h("div", { key: 'd94560b658507a515a1360057121e933b95e6fe6', "data-scope": "actions" }, index.h("slot", { key: 'db185d3924c7d1fbeb30578992f2375e92a0d4bc', name: "actions" })))))));
-    }
-    get el() { return index.getElement(this); }
-};
-NvNotification.style = NvNotificationStyle0;
-
-exports.nv_notification = NvNotification;

package/dist/cjs/nv-notificationcontainer.entry-Dwlv9s1v.js

@@ -1,41 +0,0 @@
-'use strict';
-
-var index = require('./index-CJDePE8Z.js');
-require('react');
-require('react-dom');
-
-const nvNotificationcontainerCss = "nv-notificationcontainer{position:fixed;display:flex;flex-direction:column;padding:var(--spacing-2);padding-top:0;z-index:9999;pointer-events:none;width:100%;max-width:512px}nv-notificationcontainer.position-top-right{top:0;right:0}nv-notificationcontainer.position-top-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-top-left{top:0;left:0}nv-notificationcontainer.position-top-left nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-top-center{top:0;left:50%;transform:translateX(-50%)}nv-notificationcontainer.position-top-center nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-bottom-right{bottom:0;right:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-left{bottom:0;left:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-left nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-center{bottom:0;left:50%;transform:translateX(-50%);flex-direction:column-reverse}nv-notificationcontainer.position-bottom-center nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer>*{pointer-events:auto}";
-const NvNotificationcontainerStyle0 = nvNotificationcontainerCss;
-
-const NvNotificationContainer = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        /****************************************************************************/
-        //#region PROPERTIES
-        /**
-         * Position of the notification container on the screen.
-         */
-        this.position = 'top-right';
-    }
-    //#endregion PROPERTIES
-    /****************************************************************************/
-    //#region METHODS
-    //#endregion METHODS
-    /****************************************************************************/
-    //#region WATCHERS
-    //#endregion WATCHERS
-    /****************************************************************************/
-    //#region LIFECYCLE
-    //#endregion LIFECYCLE
-    /****************************************************************************/
-    //#region EVENTS
-    //#endregion EVENTS
-    /****************************************************************************/
-    //#region RENDER
-    render() {
-        return (index.h(index.Host, { key: 'db4005459b926bcfef55e76f61bff0b5635f2872', class: `position-${this.position}` }, index.h("slot", { key: '518909541ca3e9e82168436a43d5362c414c0ec3' })));
-    }
-};
-NvNotificationContainer.style = NvNotificationcontainerStyle0;
-
-exports.nv_notificationcontainer = NvNotificationContainer;

package/dist/providers/NotificationProvider.js

@@ -1,83 +0,0 @@
-import React, { createContext, useContext, useState, useCallback, createRef, useEffect, useRef, } from 'react';
-import { createPortal } from 'react-dom';
-import { NvNotificationcontainer, NvNotification, NvButton, } from '../generated/components';
-const NotificationContext = createContext(null);
-const DEFAULT_POSITION = 'top-right';
-const DEFAULT_MAX_NOTIFICATIONS = 50;
-const generateId = () => {
-    return `notification-${Date.now()}-${Math.random()
-        .toString(36)
-        .substr(2, 9)}`;
-};
-export const NotificationProvider = ({ children, position = DEFAULT_POSITION, maxNotifications = DEFAULT_MAX_NOTIFICATIONS, className, }) => {
-    const [notifications, setNotifications] = useState([]);
-    const notificationsRef = useRef([]);
-    useEffect(() => {
-        notificationsRef.current = notifications;
-    }, [notifications]);
-    const show = useCallback((options) => {
-        const id = options.id || generateId();
-        const ref = createRef();
-        const notification = {
-            id,
-            heading: options.heading,
-            message: options.message,
-            dismissible: options.dismissible ?? true,
-            emphasis: options.emphasis ?? 'medium',
-            feedback: options.feedback ?? 'information',
-            icon: options.icon,
-            actions: options.actions ?? [],
-            actionSlot: options.actionSlot,
-            createdAt: Date.now(),
-            ref,
-        };
-        setNotifications((prev) => {
-            const newNotifications = [notification, ...prev];
-            if (newNotifications.length > maxNotifications) {
-                return newNotifications.slice(0, maxNotifications);
-            }
-            return newNotifications;
-        });
-        setTimeout(() => {
-            notification.ref.current?.show();
-        }, 0);
-        return id;
-    }, [maxNotifications]);
-    const dismiss = useCallback((id) => {
-        const n = notificationsRef.current.find((item) => item.id === id);
-        n?.ref.current?.dismiss();
-    }, []);
-    const remove = useCallback((id) => {
-        setNotifications((prev) => prev.filter((notification) => notification.id !== id));
-    }, []);
-    const removeAll = useCallback(() => {
-        setNotifications([]);
-    }, []);
-    const handleNotificationClose = useCallback((id) => {
-        remove(id);
-    }, [remove]);
-    const contextValue = {
-        notifications,
-        show,
-        dismiss,
-        remove,
-        removeAll,
-    };
-    return (React.createElement(NotificationContext.Provider, { value: contextValue },
-        children,
-        createPortal(React.createElement(NvNotificationcontainer, { position: position, className: className, "data-testid": "notification-container" }, notifications.map((notification) => (React.createElement(NvNotification, { key: notification.id, heading: notification.heading, message: notification.message, dismissible: notification.dismissible, emphasis: notification.emphasis, feedback: notification.feedback, icon: notification.icon, onHiddenChanged: (event) => {
-                if (event.detail) {
-                    handleNotificationClose(notification.id);
-                }
-            }, initiallyHidden: true, ref: notification.ref }, (Boolean(notification.actionSlot) ||
-            Boolean(notification.actions.length)) && (React.createElement("div", { slot: "actions" },
-            notification.actions.map((action) => (React.createElement(NvButton, { key: action.label, emphasis: "low", size: "md", onClick: action.onClick }, action.label))),
-            notification.actionSlot)))))), document.body)));
-};
-export const useNotifications = () => {
-    const context = useContext(NotificationContext);
-    if (!context) {
-        throw new Error('useNotifications must be used within a NotificationProvider');
-    }
-    return context;
-};

package/dist/types/providers/NotificationProvider.d.ts

@@ -1,36 +0,0 @@
-import React, { ReactNode } from 'react';
-import { type NotificationPosition, type NotificationEmphasis, FeedbackColors } from '../index';
-export interface NotificationAction {
-    label: string;
-    onClick: () => void;
-}
-export interface NotificationOptions {
-    id?: string;
-    heading?: string;
-    message?: string;
-    dismissible?: boolean;
-    emphasis?: `${NotificationEmphasis}`;
-    feedback?: `${FeedbackColors}`;
-    icon?: string;
-    actions?: NotificationAction[];
-    actionSlot?: React.ReactElement;
-}
-export interface Notification extends NotificationOptions {
-    createdAt: number;
-    ref: React.RefObject<HTMLNvNotificationElement>;
-}
-export interface NotificationContextValue {
-    notifications: Notification[];
-    show: (options: NotificationOptions) => string;
-    dismiss: (id: string) => void;
-    remove: (id: string) => void;
-    removeAll: () => void;
-}
-export interface NotificationProviderProps {
-    children: ReactNode;
-    position?: `${NotificationPosition}`;
-    maxNotifications?: number;
-    className?: string;
-}
-export declare const NotificationProvider: React.FC<NotificationProviderProps>;
-export declare const useNotifications: () => NotificationContextValue;