@steroidsjs/core 2.3.0-beta.7 → 3.0.0-beta.2

package/ui/layout/Header/Header.d.ts

@@ -1,24 +1,23 @@
-/// <reference types="react" />
-import { INavProps } from '../../nav/Nav/Nav';
-export interface IHeaderProps {
-    className?: CssClassName;
-    view?: any;
-    logo?: {
-        title: string;
-        linkProps?: Record<string, unknown>;
-        icon?: string | any;
-        className?: CssClassName;
-    };
-    nav?: INavProps;
-    /**
-     * Размер
-     */
-    size?: Size;
-    /**
-     * Темная тема
-     */
-    dark?: boolean;
-    [key: string]: any;
-}
-export declare type IHeaderViewProps = IHeaderProps;
-export default function Header(props: IHeaderProps): JSX.Element;
+import { INavProps } from '../../nav/Nav/Nav';
+export interface IHeaderProps {
+    className?: CssClassName;
+    view?: any;
+    logo?: {
+        title: string;
+        linkProps?: Record<string, unknown>;
+        icon?: string | any;
+        className?: CssClassName;
+    };
+    nav?: INavProps;
+    /**
+     * Размер
+     */
+    size?: Size;
+    /**
+     * Темная тема
+     */
+    dark?: boolean;
+    [key: string]: any;
+}
+export declare type IHeaderViewProps = IHeaderProps;
+export default function Header(props: IHeaderProps): JSX.Element;

package/ui/layout/Header/Header.js

@@ -1,7 +1,7 @@
-"use strict";
-exports.__esModule = true;
-var hooks_1 = require("../../../hooks");
-function Header(props) {
-    return hooks_1.useComponents().ui.renderView(props.view || 'layout.HeaderView', props);
-}
-exports["default"] = Header;
+"use strict";
+exports.__esModule = true;
+var hooks_1 = require("../../../hooks");
+function Header(props) {
+    return hooks_1.useComponents().ui.renderView(props.view || 'layout.HeaderView', props);
+}
+exports["default"] = Header;

package/ui/layout/Header/index.d.ts

@@ -1,2 +1,2 @@
-import Header from './Header';
-export default Header;
+import Header from './Header';
+export default Header;

package/ui/layout/Header/index.js

@@ -1,7 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var Header_1 = __importDefault(require("./Header"));
-exports["default"] = Header_1["default"];
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Header_1 = __importDefault(require("./Header"));
+exports["default"] = Header_1["default"];

package/ui/layout/Loader/Loader.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-export interface ILoaderProps {
-    view?: any;
-    [key: string]: any;
-}
-export default function Loader(props: ILoaderProps): JSX.Element;
+export interface ILoaderProps {
+    view?: any;
+    [key: string]: any;
+}
+export default function Loader(props: ILoaderProps): JSX.Element;

package/ui/layout/Loader/Loader.js

@@ -1,7 +1,7 @@
-"use strict";
-exports.__esModule = true;
-var hooks_1 = require("../../../hooks");
-function Loader(props) {
-    return hooks_1.useComponents().ui.renderView(props.view || 'layout.LoaderView', props);
-}
-exports["default"] = Loader;
+"use strict";
+exports.__esModule = true;
+var hooks_1 = require("../../../hooks");
+function Loader(props) {
+    return hooks_1.useComponents().ui.renderView(props.view || 'layout.LoaderView', props);
+}
+exports["default"] = Loader;

package/ui/layout/Loader/index.d.ts

@@ -1,2 +1,2 @@
-import Loader from './Loader';
-export default Loader;
+import Loader from './Loader';
+export default Loader;

package/ui/layout/Loader/index.js

@@ -1,7 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var Loader_1 = __importDefault(require("./Loader"));
-exports["default"] = Loader_1["default"];
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Loader_1 = __importDefault(require("./Loader"));
+exports["default"] = Loader_1["default"];

package/ui/layout/Meta/Meta.d.ts

@@ -1,56 +1,56 @@
-import { BaseHTMLAttributes, LinkHTMLAttributes, MetaHTMLAttributes, PropsWithChildren, ScriptHTMLAttributes, StyleHTMLAttributes } from 'react';
-interface IInnerHTML {
-    /**
-     * Содержимое тега
-     */
-    innerHtml?: string;
-}
-interface IScript extends ScriptHTMLAttributes<any>, IInnerHTML {
-}
-interface IStyle extends StyleHTMLAttributes<any>, IInnerHTML {
-}
-/**
- * Meta
- * Компонент используется для ssr и нужен для конфигурации html-тегов в документе.
- */
-interface IMetaProps extends PropsWithChildren<any> {
-    /**
-     * Заголовок документа
-     * @example Home page
-     */
-    title?: string;
-    /**
-     * Описание документа
-     * @example The main page of the site
-     */
-    description?: string;
-    /**
-     * Скрипты, которые необходимо разместить на сайте
-     * @example [{src: '/lib/SomeLibrary.min.js'}]
-     */
-    scripts?: IScript[];
-    /**
-     * Мета-теги
-     * @example [{name: 'yandex-verification', content: 'ce...9e6'}]
-     */
-    meta?: MetaHTMLAttributes<any>[];
-    /**
-     * Ссылки на ресурсы
-     * @example [{href: '/lib/SomeLibrary.css', rel: 'stylesheet', type: 'text/css'}]
-     */
-    links?: LinkHTMLAttributes<any>[];
-    /**
-     * Контент для тегов \<style\>
-     */
-    styles?: IStyle[];
-    /**
-     * Контент для тегов \<noscript\>
-     */
-    noScripts?: IInnerHTML[];
-    /**
-     * Конфигурация тега \<base\>
-     */
-    base?: BaseHTMLAttributes<any>;
-}
-declare function Meta(props: IMetaProps): JSX.Element;
-export default Meta;
+import { BaseHTMLAttributes, LinkHTMLAttributes, MetaHTMLAttributes, PropsWithChildren, ScriptHTMLAttributes, StyleHTMLAttributes } from 'react';
+interface IInnerHTML {
+    /**
+     * Содержимое тега
+     */
+    innerHtml?: string;
+}
+interface IScript extends ScriptHTMLAttributes<any>, IInnerHTML {
+}
+interface IStyle extends StyleHTMLAttributes<any>, IInnerHTML {
+}
+/**
+ * Meta
+ * Компонент используется для ssr и нужен для конфигурации html-тегов в документе.
+ */
+interface IMetaProps extends PropsWithChildren<any> {
+    /**
+     * Заголовок документа
+     * @example Home page
+     */
+    title?: string;
+    /**
+     * Описание документа
+     * @example The main page of the site
+     */
+    description?: string;
+    /**
+     * Скрипты, которые необходимо разместить на сайте
+     * @example [{src: '/lib/SomeLibrary.min.js'}]
+     */
+    scripts?: IScript[];
+    /**
+     * Мета-теги
+     * @example [{name: 'yandex-verification', content: 'ce...9e6'}]
+     */
+    meta?: MetaHTMLAttributes<any>[];
+    /**
+     * Ссылки на ресурсы
+     * @example [{href: '/lib/SomeLibrary.css', rel: 'stylesheet', type: 'text/css'}]
+     */
+    links?: LinkHTMLAttributes<any>[];
+    /**
+     * Контент для тегов \<style\>
+     */
+    styles?: IStyle[];
+    /**
+     * Контент для тегов \<noscript\>
+     */
+    noScripts?: IInnerHTML[];
+    /**
+     * Конфигурация тега \<base\>
+     */
+    base?: BaseHTMLAttributes<any>;
+}
+declare function Meta(props: IMetaProps): JSX.Element;
+export default Meta;

package/ui/layout/Meta/Meta.js

@@ -1,36 +1,36 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(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);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var react_1 = __importDefault(require("react"));
-var react_helmet_1 = __importDefault(require("react-helmet"));
-function Meta(props) {
-    var _a, _b, _c, _d, _e;
-    return (react_1["default"].createElement(react_helmet_1["default"], null,
-        react_1["default"].createElement("title", null, props.title),
-        props.base && react_1["default"].createElement("base", __assign({}, props.base)),
-        props.description && react_1["default"].createElement("meta", { name: 'description', content: props.description }), (_a = props.meta) === null || _a === void 0 ? void 0 :
-        _a.map(function (attrs, index) { return react_1["default"].createElement("meta", __assign({ key: index }, attrs)); }), (_b = props.links) === null || _b === void 0 ? void 0 :
-        _b.map(function (attrs, index) { return react_1["default"].createElement("link", __assign({ key: index }, attrs)); }), (_c = props.styles) === null || _c === void 0 ? void 0 :
-        _c.map(function (attrs, index) { return (react_1["default"].createElement("style", __assign({ key: index }, attrs, { dangerouslySetInnerHTML: {
-                __html: attrs.innerHtml
-            } }))); }), (_d = props.scripts) === null || _d === void 0 ? void 0 :
-        _d.map(function (attrs, index) { return (react_1["default"].createElement("script", __assign({ key: index }, attrs), attrs.innerHtml || '')); }), (_e = props.noScripts) === null || _e === void 0 ? void 0 :
-        _e.map(function (attrs, index) { return (react_1["default"].createElement("noscript", { key: index, dangerouslySetInnerHTML: {
-                __html: attrs.innerHtml
-            } })); }),
-        props.children));
-}
-exports["default"] = Meta;
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var react_1 = __importDefault(require("react"));
+var react_helmet_1 = __importDefault(require("react-helmet"));
+function Meta(props) {
+    var _a, _b, _c, _d, _e;
+    return (react_1["default"].createElement(react_helmet_1["default"], null,
+        react_1["default"].createElement("title", null, props.title),
+        props.base && react_1["default"].createElement("base", __assign({}, props.base)),
+        props.description && react_1["default"].createElement("meta", { name: 'description', content: props.description }), (_a = props.meta) === null || _a === void 0 ? void 0 :
+        _a.map(function (attrs, index) { return react_1["default"].createElement("meta", __assign({ key: index }, attrs)); }), (_b = props.links) === null || _b === void 0 ? void 0 :
+        _b.map(function (attrs, index) { return react_1["default"].createElement("link", __assign({ key: index }, attrs)); }), (_c = props.styles) === null || _c === void 0 ? void 0 :
+        _c.map(function (attrs, index) { return (react_1["default"].createElement("style", __assign({ key: index }, attrs, { dangerouslySetInnerHTML: {
+                __html: attrs.innerHtml
+            } }))); }), (_d = props.scripts) === null || _d === void 0 ? void 0 :
+        _d.map(function (attrs, index) { return (react_1["default"].createElement("script", __assign({ key: index }, attrs), attrs.innerHtml || '')); }), (_e = props.noScripts) === null || _e === void 0 ? void 0 :
+        _e.map(function (attrs, index) { return (react_1["default"].createElement("noscript", { key: index, dangerouslySetInnerHTML: {
+                __html: attrs.innerHtml
+            } })); }),
+        props.children));
+}
+exports["default"] = Meta;

package/ui/layout/Meta/index.d.ts

@@ -1,2 +1,2 @@
-import Meta from './Meta';
-export default Meta;
+import Meta from './Meta';
+export default Meta;

package/ui/layout/Meta/index.js

@@ -1,7 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var Meta_1 = __importDefault(require("./Meta"));
-exports["default"] = Meta_1["default"];
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Meta_1 = __importDefault(require("./Meta"));
+exports["default"] = Meta_1["default"];

package/ui/layout/Notifications/Notifications.d.ts

@@ -1,59 +1,59 @@
-import * as React from 'react';
-/**
- * Перед тем как использовать компонент Notification поместите его в DOM дереве следующим образом:
- * ```
- * <div className={bem.block()})}>
- * ```
- *      <Notifications/>
- *      ```
- *      <ModalPortal/>
- *      ```
- *      <TooltipPortal/>
- *      ```
- * </div>
- * ```
- */
-interface INotificationItem {
-    id?: number;
-    /**
-     * Цвет всплывающего уведомления
-     * @example warning
-     */
-    level?: ColorName;
-    /**
-     * Сообщение во всплывающем уведомлении
-     * @example Сохранено!
-     */
-    message?: string;
-    isClosing?: boolean;
-}
-export interface INotificationsProps {
-    initialFlashes?: {
-        [key: string]: string | any;
-    };
-    notifications?: INotificationItem[];
-    closeTimeoutMs?: number;
-    className?: CssClassName;
-    view?: any;
-    itemView?: any;
-    position?: string;
-    [key: string]: any;
-}
-export interface INotificationsViewProps {
-    notifications?: INotificationItem[];
-    className?: CssClassName;
-    position: string;
-    children?: React.ReactNode;
-}
-export interface INotificationsItemViewProps extends INotificationItem {
-    isClosing: boolean;
-    onClose: () => void;
-    position: string;
-}
-declare function Notifications(props: INotificationsProps): JSX.Element;
-declare namespace Notifications {
-    var defaultProps: {
-        closeTimeoutMs: number;
-    };
-}
-export default Notifications;
+import * as React from 'react';
+/**
+ * Перед тем как использовать компонент Notification поместите его в DOM дереве следующим образом:
+ * ```
+ * <div className={bem.block()})}>
+ * ```
+ *      <Notifications/>
+ *      ```
+ *      <ModalPortal/>
+ *      ```
+ *      <TooltipPortal/>
+ *      ```
+ * </div>
+ * ```
+ */
+interface INotificationItem {
+    id?: number;
+    /**
+     * Цвет всплывающего уведомления
+     * @example warning
+     */
+    level?: ColorName;
+    /**
+     * Сообщение во всплывающем уведомлении
+     * @example Сохранено!
+     */
+    message?: string;
+    isClosing?: boolean;
+}
+export interface INotificationsProps {
+    initialFlashes?: {
+        [key: string]: string | any;
+    };
+    notifications?: INotificationItem[];
+    closeTimeoutMs?: number;
+    className?: CssClassName;
+    view?: any;
+    itemView?: any;
+    position?: string;
+    [key: string]: any;
+}
+export interface INotificationsViewProps {
+    notifications?: INotificationItem[];
+    className?: CssClassName;
+    position: string;
+    children?: React.ReactNode;
+}
+export interface INotificationsItemViewProps extends INotificationItem {
+    isClosing: boolean;
+    onClose: () => void;
+    position: string;
+}
+declare function Notifications(props: INotificationsProps): JSX.Element;
+declare namespace Notifications {
+    var defaultProps: {
+        closeTimeoutMs: number;
+    };
+}
+export default Notifications;

package/ui/layout/Notifications/Notifications.js

@@ -1,89 +1,89 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(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);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var orderBy_1 = __importDefault(require("lodash-es/orderBy"));
-var react_1 = require("react");
-var react_use_1 = require("react-use");
-var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
-var hooks_1 = require("../../../hooks");
-var notifications_1 = require("../../../actions/notifications");
-var notifications_2 = require("../../../reducers/notifications");
-function Notifications(props) {
-    var _a = hooks_1.useSelector(function (state) { return ({
-        notifications: notifications_2.getNotifications(state),
-        position: notifications_2.getPosition(state)
-    }); }), notifications = _a.notifications, position = _a.position;
-    var components = hooks_1.useComponents();
-    var _b = react_1.useState(props.notifications || []), innerNotifications = _b[0], setInnerNotifications = _b[1];
-    var _c = react_1.useState([]), closing = _c[0], setClosing = _c[1];
-    var dispatch = useDispatch_1["default"]();
-    react_use_1.useMount(function () {
-        if (props.initialFlashes) {
-            dispatch(notifications_1.setFlashes(props.initialFlashes));
-            // Disable scroll or scroll to top on show notifications
-            if (!process.env.IS_SSR) {
-                if ('scrollRestoration' in window.history) {
-                    window.history.scrollRestoration = 'manual';
-                }
-                else {
-                    setTimeout(function () { return window.scrollTo(0, 0); }, 1000);
-                }
-            }
-        }
-    });
-    var prevNotifications = react_use_1.usePrevious(notifications);
-    react_use_1.useUpdateEffect(function () {
-        if (prevNotifications !== notifications) {
-            var propsIds_1 = notifications.map(function (item) { return item.id; });
-            var toClose_1 = innerNotifications.filter(function (item) { return !propsIds_1.includes(item.id); });
-            setInnerNotifications([].concat(notifications));
-            setClosing(closing.concat(innerNotifications.filter(function (item) { return !propsIds_1.includes(item.id); })));
-            if (toClose_1.length > 0) {
-                setTimeout(function () { return setClosing(closing.filter(function (item) { return !toClose_1.includes(item); })); }, props.closeTimeoutMs);
-            }
-        }
-    }, [closing, innerNotifications, notifications, prevNotifications, props.closeTimeoutMs]);
-    var onClose = react_1.useCallback(function (notificationId) { return dispatch(notifications_1.closeNotification(notificationId)); }, [dispatch]);
-    var closingIds = closing.map(function (item) { return item.id; });
-    var items = react_1.useMemo(function () { return (orderBy_1["default"]([].concat(innerNotifications).concat(closing), ['id'], 'asc')
-        .map(function (item) { return (__assign(__assign({}, item), { isClosing: closingIds.includes(item.id), onClose: function () { return onClose(item.id); } })); })); }, [innerNotifications, closing, closingIds, onClose]);
-    var NotificationsItemView = props.itemView || components.ui.getView('layout.NotificationsItemView');
-    return components.ui.renderView(props.view || 'layout.NotificationsView', __assign(__assign({}, props), { position: position || '', children: items.map(function (item) { return (React.createElement(NotificationsItemView, __assign({ key: item.id }, item))); }) }));
-}
-Notifications.defaultProps = {
-    closeTimeoutMs: 1500
-};
-exports["default"] = Notifications;
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(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);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var React = __importStar(require("react"));
+var orderBy_1 = __importDefault(require("lodash-es/orderBy"));
+var react_1 = require("react");
+var react_use_1 = require("react-use");
+var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
+var hooks_1 = require("../../../hooks");
+var notifications_1 = require("../../../actions/notifications");
+var notifications_2 = require("../../../reducers/notifications");
+function Notifications(props) {
+    var _a = hooks_1.useSelector(function (state) { return ({
+        notifications: notifications_2.getNotifications(state),
+        position: notifications_2.getPosition(state)
+    }); }), notifications = _a.notifications, position = _a.position;
+    var components = hooks_1.useComponents();
+    var _b = react_1.useState(props.notifications || []), innerNotifications = _b[0], setInnerNotifications = _b[1];
+    var _c = react_1.useState([]), closing = _c[0], setClosing = _c[1];
+    var dispatch = useDispatch_1["default"]();
+    react_use_1.useMount(function () {
+        if (props.initialFlashes) {
+            dispatch(notifications_1.setFlashes(props.initialFlashes));
+            // Disable scroll or scroll to top on show notifications
+            if (!process.env.IS_SSR) {
+                if ('scrollRestoration' in window.history) {
+                    window.history.scrollRestoration = 'manual';
+                }
+                else {
+                    setTimeout(function () { return window.scrollTo(0, 0); }, 1000);
+                }
+            }
+        }
+    });
+    var prevNotifications = react_use_1.usePrevious(notifications);
+    react_use_1.useUpdateEffect(function () {
+        if (prevNotifications !== notifications) {
+            var propsIds_1 = notifications.map(function (item) { return item.id; });
+            var toClose_1 = innerNotifications.filter(function (item) { return !propsIds_1.includes(item.id); });
+            setInnerNotifications([].concat(notifications));
+            setClosing(closing.concat(innerNotifications.filter(function (item) { return !propsIds_1.includes(item.id); })));
+            if (toClose_1.length > 0) {
+                setTimeout(function () { return setClosing(closing.filter(function (item) { return !toClose_1.includes(item); })); }, props.closeTimeoutMs);
+            }
+        }
+    }, [closing, innerNotifications, notifications, prevNotifications, props.closeTimeoutMs]);
+    var onClose = react_1.useCallback(function (notificationId) { return dispatch(notifications_1.closeNotification(notificationId)); }, [dispatch]);
+    var closingIds = closing.map(function (item) { return item.id; });
+    var items = react_1.useMemo(function () { return (orderBy_1["default"]([].concat(innerNotifications).concat(closing), ['id'], 'asc')
+        .map(function (item) { return (__assign(__assign({}, item), { isClosing: closingIds.includes(item.id), onClose: function () { return onClose(item.id); } })); })); }, [innerNotifications, closing, closingIds, onClose]);
+    var NotificationsItemView = props.itemView || components.ui.getView('layout.NotificationsItemView');
+    return components.ui.renderView(props.view || 'layout.NotificationsView', __assign(__assign({}, props), { position: position || '', children: items.map(function (item) { return (React.createElement(NotificationsItemView, __assign({ key: item.id }, item))); }) }));
+}
+Notifications.defaultProps = {
+    closeTimeoutMs: 1500
+};
+exports["default"] = Notifications;