@alfalab/core-components 20.2.0 → 20.4.0

package/modal/tslib.es6-ccd35f7f.js

@@ -0,0 +1,40 @@
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+exports.__assign = function () {
+    exports.__assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return exports.__assign.apply(this, arguments);
+};
+function __rest(s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+exports.__rest = __rest;

package/mq/cssm/Component.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+type MqProps = {
+    /**
+     * Media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+     */
+    query?: string;
+    /**
+     * Запрос на поддержку тач-событий
+     */
+    touch?: boolean;
+    /**
+     * Обработчик изменений в совпадении запросов
+     */
+    onMatchChange?: (isMatched: boolean) => void;
+};
+declare const Mq: FC<MqProps>;
+export { MqProps, Mq };

package/mq/cssm/Component.js

@@ -0,0 +1,26 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var utils = require('./utils.js');
+var useMatchMedia = require('./useMatchMedia.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var IS_BROWSER = typeof window !== 'undefined';
+var SUPPORTS_TOUCH = IS_BROWSER && (utils.isPointerEventsSupported() || utils.isTouchSupported());
+var Mq = function (_a) {
+    var children = _a.children, _b = _a.query, query = _b === void 0 ? '' : _b, touch = _a.touch, onMatchChange = _a.onMatchChange;
+    var queryMatches = useMatchMedia.useMatchMedia(query)[0];
+    var touchPass = touch === undefined ? true : touch === SUPPORTS_TOUCH;
+    var matches = touchPass && (!query || queryMatches);
+    React.useEffect(function () {
+        if (onMatchChange) {
+            onMatchChange(matches);
+        }
+    }, [matches, onMatchChange]);
+    return React__default['default'].createElement(React.Fragment, null, matches && IS_BROWSER ? children : null);
+};
+
+exports.Mq = Mq;

package/mq/cssm/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Component";
+export * from "./useMatchMedia";

package/mq/cssm/index.js

@@ -0,0 +1,11 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('react');
+require('./utils.js');
+var useMatchMedia = require('./useMatchMedia.js');
+var Component = require('./Component.js');
+
+
+
+exports.useMatchMedia = useMatchMedia.useMatchMedia;
+exports.Mq = Component.Mq;

package/mq/cssm/useMatchMedia.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Хук для медиа запросов.
+ * @param query media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+declare const useMatchMedia: (query: string) => boolean[];
+export { useMatchMedia };

package/mq/cssm/useMatchMedia.js

@@ -0,0 +1,25 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var utils = require('./utils.js');
+
+/**
+ * Хук для медиа запросов.
+ * @param query media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+var useMatchMedia = function (query) {
+    var _a = React.useState(false), matches = _a[0], setMatches = _a[1];
+    React.useEffect(function () {
+        var mql = utils.getMatchMedia(query);
+        var handleMatchChange = function () { return setMatches(mql.matches); };
+        mql.addListener(handleMatchChange);
+        handleMatchChange();
+        return function () {
+            mql.removeListener(handleMatchChange);
+            utils.releaseMatchMedia(query);
+        };
+    }, [query]);
+    return [matches];
+};
+
+exports.useMatchMedia = useMatchMedia;

package/mq/cssm/utils.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Возвращает MediaQueryList для заданного media-выражения.
+ *
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+declare function getMatchMedia(queryProp: string): MediaQueryList;
+/**
+ * Удаляет MediaQueryList.
+ *
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+declare function releaseMatchMedia(queryProp: string): void;
+/**
+ * Возвращает `true`, если есть поддержка `Pointer Events`
+ */
+declare function isPointerEventsSupported(): boolean;
+/**
+ * Возвращает `true`, если есть поддержка `Touch Events`
+ */
+declare function isTouchSupported(): boolean;
+export { getMatchMedia, releaseMatchMedia, isPointerEventsSupported, isTouchSupported };

package/mq/cssm/utils.js

@@ -0,0 +1,69 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var MqList = {
+	"--mobile-xs": "(min-width: 320px)",
+	"--mobile-s": "(min-width: 360px)",
+	"--mobile-m": "(min-width: 375px)",
+	"--mobile-l": "(min-width: 412px)",
+	"--mobile": "(max-width: 599px)",
+	"--tablet-s": "(min-width: 600px)",
+	"--tablet-m": "(min-width: 768px)",
+	"--tablet": "(min-width: 600px) and (max-width: 1023px)",
+	"--desktop-s": "(min-width: 1024px)",
+	"--desktop-m": "(min-width: 1280px)",
+	"--desktop-l": "(min-width: 1440px)",
+	"--desktop-xl": "(min-width: 1920px)",
+	"--desktop": "(min-width: 1024px)"
+};
+
+// TODO: перенести в alfalab/utils
+var pool = {};
+var refCounters = {};
+/**
+ * Возвращает MediaQueryList для заданного media-выражения.
+ *
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+function getMatchMedia(queryProp) {
+    var query = MqList[queryProp] || queryProp;
+    if (pool[query]) {
+        refCounters[query] += 1;
+    }
+    else {
+        pool[query] = window.matchMedia(query);
+        refCounters[query] = 1;
+    }
+    return pool[query];
+}
+/**
+ * Удаляет MediaQueryList.
+ *
+ * @param queryProp media выражение или кастомный запрос из `mq.json`, например `--mobile`.
+ */
+function releaseMatchMedia(queryProp) {
+    var query = MqList[queryProp] || queryProp;
+    refCounters[query] -= 1;
+    if (pool[query] && refCounters[query] === 0) {
+        delete pool[query];
+        delete refCounters[query];
+    }
+}
+/**
+ * Возвращает `true`, если есть поддержка `Pointer Events`
+ */
+function isPointerEventsSupported() {
+    return 'PointerEvent' in window || 'msPointerEnabled' in window.navigator;
+}
+/**
+ * Возвращает `true`, если есть поддержка `Touch Events`
+ */
+function isTouchSupported() {
+    return ('ontouchstart' in window ||
+        window.navigator.maxTouchPoints > 0 ||
+        window.navigator.msMaxTouchPoints > 0);
+}
+
+exports.getMatchMedia = getMatchMedia;
+exports.isPointerEventsSupported = isPointerEventsSupported;
+exports.isTouchSupported = isTouchSupported;
+exports.releaseMatchMedia = releaseMatchMedia;

package/notification/cssm/Component.d.ts

@@ -0,0 +1,97 @@
+/// <reference types="react" />
+import React from 'react';
+import { MouseEvent } from "react";
+import { ToastPlateProps } from "../../toast-plate";
+type NotificationProps = ToastPlateProps & {
+    /**
+     * Управление видимостью компонента
+     */
+    visible?: boolean;
+    /**
+     * Отступ от верхнего края
+     */
+    offset?: number;
+    /**
+     * Время до закрытия компонента
+     */
+    autoCloseDelay?: number | null;
+    /**
+     * Использовать портал
+     */
+    usePortal?: boolean;
+    /**
+     * z-index компонента
+     */
+    zIndex?: number;
+    /**
+     * Обработчик события истечения времени до закрытия компонента
+     */
+    onCloseTimeout?: () => void;
+    /**
+     * Обработчик события наведения курсора на компонент
+     */
+    onMouseEnter?: (event?: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Обработчик события снятия курсора с компонента
+     */
+    onMouseLeave?: (event?: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Обработчик клика вне компонента
+     */
+    onClickOutside?: (event?: MouseEvent<any>) => void;
+};
+declare const Notification: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    className?: string | undefined;
+    contentClassName?: string | undefined;
+    children?: React.ReactNode;
+    title?: React.ReactNode;
+    badge?: "positive" | "attention" | "negative" | undefined;
+    /**
+     * Обработчик события наведения курсора на компонент
+     */
+    leftAddons?: React.ReactNode;
+    actionButton?: React.ReactNode;
+    dataTestId?: string | undefined;
+    hasCloser?: boolean | undefined;
+    block?: boolean | undefined;
+    onClose?: ((event?: React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent> | undefined) => void) | undefined;
+    getBadgeIcons?: ((icons: import("../../toast-plate").BadgeIcons) => import("../../toast-plate").BadgeIcons) | undefined;
+} & {
+    /**
+     * Управление видимостью компонента
+     */
+    visible?: boolean | undefined;
+    /**
+     * Отступ от верхнего края
+     */
+    offset?: number | undefined;
+    /**
+     * Время до закрытия компонента
+     */
+    autoCloseDelay?: number | null | undefined;
+    /**
+     * Использовать портал
+     */
+    usePortal?: boolean | undefined;
+    /**
+     * z-index компонента
+     */
+    zIndex?: number | undefined;
+    /**
+     * Обработчик события истечения времени до закрытия компонента
+     */
+    onCloseTimeout?: (() => void) | undefined;
+    /**
+     * Обработчик события наведения курсора на компонент
+     */
+    onMouseEnter?: ((event?: React.MouseEvent<HTMLDivElement, globalThis.MouseEvent> | undefined) => void) | undefined;
+    /**
+     * Обработчик события снятия курсора с компонента
+     */
+    onMouseLeave?: ((event?: React.MouseEvent<HTMLDivElement, globalThis.MouseEvent> | undefined) => void) | undefined;
+    /**
+     * Обработчик клика вне компонента
+     */
+    onClickOutside?: ((event?: React.MouseEvent<any, globalThis.MouseEvent> | undefined) => void) | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export { NotificationProps, Notification };

package/notification/cssm/Component.js

@@ -0,0 +1,153 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var cn = require('classnames');
+var mergeRefs = require('react-merge-refs');
+var reactSwipeable = require('react-swipeable');
+var elementClosest = require('element-closest');
+var coreComponentsPortal = require('../../portal/cssm');
+var coreComponentsToastPlate = require('../../toast-plate/cssm');
+var coreComponentsStack = require('../../stack/cssm');
+var utils_index = require('./utils/index.js');
+var styles = require('./index.module.css');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+var mergeRefs__default = /*#__PURE__*/_interopDefaultLegacy(mergeRefs);
+var elementClosest__default = /*#__PURE__*/_interopDefaultLegacy(elementClosest);
+var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
+
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+var __assign = function () {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+function __rest(s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+var notificationClassNameSelector = "." + styles__default['default'].notificationComponent;
+var Notification = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, visible = _a.visible, _b = _a.offset, offset = _b === void 0 ? 108 : _b, _c = _a.hasCloser, hasCloser = _c === void 0 ? true : _c, _d = _a.autoCloseDelay, autoCloseDelay = _d === void 0 ? 5000 : _d, _e = _a.usePortal, usePortal = _e === void 0 ? true : _e, _f = _a.zIndex, zIndex = _f === void 0 ? coreComponentsStack.stackingOrder.TOAST : _f, style = _a.style, onClose = _a.onClose, onCloseTimeout = _a.onCloseTimeout, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, onClickOutside = _a.onClickOutside, restProps = __rest(_a, ["className", "children", "visible", "offset", "hasCloser", "autoCloseDelay", "usePortal", "zIndex", "style", "onClose", "onCloseTimeout", "onMouseEnter", "onMouseLeave", "onClickOutside"]);
+    var notificationRef = React.useRef(null);
+    var autoCloseTimeoutRef = React.useRef(0);
+    var closeTimeoutRef = React.useRef(0);
+    var _g = React.useState(false), isClosing = _g[0], setIsClosing = _g[1];
+    var startAutoCloseTimer = React.useCallback(function () {
+        if (autoCloseDelay !== null) {
+            autoCloseTimeoutRef.current = window.setTimeout(function () {
+                if (onCloseTimeout) {
+                    onCloseTimeout();
+                }
+            }, autoCloseDelay);
+        }
+    }, [autoCloseDelay, onCloseTimeout]);
+    var stopAutoCloseTimer = React.useCallback(function () {
+        clearTimeout(autoCloseTimeoutRef.current);
+    }, []);
+    React.useEffect(function () { return function () {
+        clearTimeout(closeTimeoutRef.current);
+    }; }, []);
+    React.useEffect(function () {
+        elementClosest__default['default'](window);
+    }, []);
+    React.useEffect(function () {
+        if (visible) {
+            startAutoCloseTimer();
+        }
+        return function () {
+            stopAutoCloseTimer();
+        };
+    }, [startAutoCloseTimer, stopAutoCloseTimer, visible]);
+    var handleMouseEnter = React.useCallback(function (event) {
+        stopAutoCloseTimer();
+        if (onMouseEnter) {
+            onMouseEnter(event);
+        }
+    }, [onMouseEnter, stopAutoCloseTimer]);
+    var handleMouseLeave = React.useCallback(function (event) {
+        stopAutoCloseTimer();
+        startAutoCloseTimer();
+        if (onMouseLeave) {
+            onMouseLeave(event);
+        }
+    }, [onMouseLeave, startAutoCloseTimer, stopAutoCloseTimer]);
+    var handleOutsideClick = React.useCallback(function (event) {
+        var isTargetNotification = !!event.target.closest(notificationClassNameSelector);
+        /*
+         *  проверка isTargetNotification нужна для предотвращения срабатывания handleOutsideClick
+         *  при клике на другие нотификации, если их несколько на странице
+         */
+        if (onClickOutside && visible && !isTargetNotification) {
+            onClickOutside(event);
+        }
+    }, [onClickOutside, visible]);
+    utils_index.useClickOutside(notificationRef, handleOutsideClick);
+    var swipeableHandlers = reactSwipeable.useSwipeable({
+        onSwiped: function (_a) {
+            var dir = _a.dir;
+            if (onClose && ['Left', 'Right', 'Up'].includes(dir)) {
+                setIsClosing(true);
+                closeTimeoutRef.current = window.setTimeout(function () {
+                    setIsClosing(false);
+                    onClose();
+                }, 100);
+            }
+        },
+        delta: 100,
+        trackMouse: true,
+    });
+    var Wrapper = usePortal ? coreComponentsPortal.Portal : React.Fragment;
+    return (React__default['default'].createElement(coreComponentsStack.Stack, { value: zIndex }, function (computedZIndex) {
+        var _a;
+        return (React__default['default'].createElement(Wrapper, null,
+            React__default['default'].createElement("div", __assign({}, swipeableHandlers),
+                React__default['default'].createElement(coreComponentsToastPlate.ToastPlate, __assign({ className: cn__default['default'](styles__default['default'].notificationComponent, (_a = {},
+                        _a[styles__default['default'].isVisible] = visible,
+                        _a[styles__default['default'].isClosing] = isClosing,
+                        _a), className), contentClassName: styles__default['default'].toastContent, style: __assign({ top: offset, zIndex: computedZIndex }, style), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ref: mergeRefs__default['default']([ref, notificationRef]), role: visible ? 'alert' : undefined, hasCloser: hasCloser, onClose: onClose }, restProps), children))));
+    }));
+});
+/**
+ * Для отображения в сторибуке
+ */
+Notification.defaultProps = {
+    autoCloseDelay: 5000,
+    offset: 108,
+    hasCloser: true,
+    usePortal: true,
+};
+
+exports.Notification = Notification;

package/notification/cssm/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

package/notification/cssm/index.js

@@ -0,0 +1,17 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Component = require('./Component.js');
+require('react');
+require('classnames');
+require('react-merge-refs');
+require('react-swipeable');
+require('element-closest');
+require('../../portal/cssm');
+require('../../toast-plate/cssm');
+require('../../stack/cssm');
+require('./utils/index.js');
+require('./index.module.css');
+
+
+
+exports.Notification = Component.Notification;

package/notification/cssm/index.module.css

@@ -0,0 +1,56 @@
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --gap-s: 12px;
+    --gap-xl: 24px;
+    --gap-4xl: 48px;
+}
+:root {
+    --notification-desktop-content-width: 278px;
+}
+.notificationComponent {
+    visibility: hidden;
+    position: fixed;
+    right: var(--gap-s);
+    transform: translate(0, -500px);
+    display: inline-flex;
+    width: calc(100% - var(--gap-xl));
+    max-width: calc(100vw - var(--gap-xl));
+    -webkit-user-select: none;
+            user-select: none;
+    transition: transform 0.4s ease-out
+}
+@media screen and (min-width: 600px) {
+.notificationComponent {
+        right: var(--gap-4xl);
+        width: auto;
+        transform: translate(var(--notification-desktop-content-width), 0)
+}
+    }
+.notificationComponent.isVisible {
+        visibility: visible;
+        transform: translate(0, 0);
+    }
+.notificationComponent.isClosing {
+        transition: transform 0.1s ease-out;
+        transform: translate(100vw, 0)
+    }
+@media screen and (min-width: 600px) {
+.notificationComponent.isClosing {
+            transform: translate(
+                calc(var(--notification-desktop-content-width) + var(--gap-4xl)),
+                0
+            )
+    }
+        }
+@media screen and (min-width: 600px) {
+.toastContent {
+        width: var(--notification-desktop-content-width)
+}
+    }

package/notification/cssm/utils/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import React from 'react';
+declare function useClickOutside(ref: React.RefObject<HTMLElement>, cb: (e: React.MouseEvent | React.TouchEvent) => void): void;
+export { useClickOutside };

package/notification/cssm/utils/index.js

@@ -0,0 +1,32 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/*
+ * Дублирую хук из @alfalab/hooks, так как не подходят названия событий
+ * https://github.com/alfa-laboratory/utils/blob/develop/packages/hooks/src/useClickOutside/hook.ts
+ * issue завел, когда изменения будут реализованы, отсюда можно будет удалить
+ * https://github.com/alfa-laboratory/utils/issues/35
+ */
+function useClickOutside(ref, cb) {
+    React__default['default'].useEffect(function () {
+        var handler = function (event) {
+            if (!ref.current || ref.current.contains(event.target)) {
+                return;
+            }
+            cb(event);
+        };
+        document.addEventListener('click', handler);
+        document.addEventListener('touchend', handler);
+        return function () {
+            document.removeEventListener('click', handler);
+            document.removeEventListener('touchend', handler);
+        };
+    }, [ref, cb]);
+}
+
+exports.useClickOutside = useClickOutside;

package/notification-manager/cssm/component-d28c47be.d.ts

@@ -0,0 +1,43 @@
+import { ReactElement, FC } from 'react';
+import { NotificationProps as CoreNotificationProps } from "../../notification";
+declare function __extends(d: any, b: any): void;
+declare function __rest(s: any, e: any): {};
+declare function __decorate(decorators: any, target: any, key: any, desc: any, ...args: any[]): any;
+declare function __param(paramIndex: any, decorator: any): (target: any, key: any) => void;
+declare function __metadata(metadataKey: any, metadataValue: any): any;
+declare function __awaiter(thisArg: any, _arguments: any, P: any, generator: any): any;
+declare function __generator(thisArg: any, body: any): {
+    next: (v: any) => any;
+    throw: (v: any) => any;
+    return: (v: any) => any;
+};
+declare function __exportStar(m: any, o: any): void;
+declare function __values(o: any): any;
+declare function __read(o: any, n: any): any;
+declare function __spread(...args: any[]): any[];
+declare function __spreadArrays(...args: any[]): any[];
+declare function __await(v: any): any;
+declare class __await {
+    constructor(v: any);
+    v: any;
+}
+declare function __asyncGenerator(thisArg: any, _arguments: any, generator: any): {};
+declare function __asyncDelegator(o: any): {};
+declare function __asyncValues(o: any): any;
+declare function __makeTemplateObject(cooked: any, raw: any): any;
+declare function __importStar(mod: any): any;
+declare function __importDefault(mod: any): any;
+declare function __classPrivateFieldGet(receiver: any, privateMap: any): any;
+declare function __classPrivateFieldSet(receiver: any, privateMap: any, value: any): any;
+declare function __assign(...args: any[]): any;
+declare function __createBinding(o: any, m: any, k: any, k2: any): void;
+type NotificationElement = ReactElement<CoreNotificationProps & {
+    id: string;
+}>;
+type NotificationProps = {
+    element: NotificationElement;
+    className: string;
+    onRemoveNotification: (id: string) => void;
+};
+declare const Notification: FC<NotificationProps>;
+export { __extends, __rest, __decorate, __param, __metadata, __awaiter, __generator, __exportStar, __values, __read, __spread, __spreadArrays, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __assign, __createBinding, NotificationElement, Notification };