@salutejs/plasma-new-hope 0.119.0-dev.0 → 0.119.1-dev.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,3 +1,4 @@
1
+ import './NotificationsPortal_6417q6.css';
1
2
  'use strict';
2
3
 
3
4
  Object.defineProperty(exports, '__esModule', { value: true });
@@ -5,6 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
6
  var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
6
7
  var React = require('react');
7
8
  var react = require('storeon/react');
9
+ var react$1 = require('@linaria/react');
8
10
  var PopupContext = require('../Popup/PopupContext.js');
9
11
  var Popup$1 = require('../Popup/Popup.js');
10
12
  require('@linaria/core');
@@ -18,6 +20,14 @@ var _excluded = ["id", "isHidden"];
18
20
 
19
21
  // issue #823
20
22
  var Popup = /*#__PURE__*/common.component(Popup$1.popupConfig);
23
+ var _exp = function _exp() {
24
+ return Popup;
25
+ };
26
+ var StyledPopup = /*#__PURE__*/react$1.styled(_exp())({
27
+ name: "StyledPopup",
28
+ "class": "s19gbs9t",
29
+ propsAsIs: true
30
+ });
21
31
 
22
32
  /**
23
33
  * Обертка для визуального представления уведомлений.
@@ -30,7 +40,7 @@ var NotificationsPortal = function NotificationsPortal(_ref) {
30
40
  var Notification = React.useMemo(function () {
31
41
  return common.component(config);
32
42
  }, []);
33
- return /*#__PURE__*/React.createElement(PopupContext.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(Popup, {
43
+ return /*#__PURE__*/React.createElement(PopupContext.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(StyledPopup, {
34
44
  isOpen: true,
35
45
  frame: frame,
36
46
  placement: "bottom-right",
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n const Notification = useMemo(\n () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n [],\n );\n\n return (\n <PopupProvider>\n {notifications.length > 0 && (\n <Popup isOpen frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n <StyledRoot>\n {notifications.map(({ id, isHidden, ...rest }) => (\n <StyledItemWrapper\n key={id}\n className={cx(\n isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n )}\n isHidden={isHidden || false}\n >\n <Notification\n key={id}\n id={id}\n onCloseButtonClick={() => closeNotification(id)}\n {...rest}\n />\n </StyledItemWrapper>\n ))}\n </StyledRoot>\n </Popup>\n )}\n </PopupProvider>\n );\n};\n"],"names":["Popup","component","popupConfig","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","isOpen","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","_objectWithoutProperties","_excluded","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;;;;;AAYA;AACA,IAAMA,KAAK,gBAAGC,gBAAS,CAACC,mBAAW,CAAC,CAAA;;AAEpC;AACA;AACA;IACaC,mBAAgD,GAAG,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK,CAAA;AAC5E,EAAA,IAAAC,WAAA,GAA0BC,gBAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAa,GAAAF,WAAA,CAAbE,aAAa,CAAA;EAErB,IAAMC,YAAY,GAAGC,aAAO,CACxB,YAAA;IAAA,OAAMV,gBAAS,CAACI,MAAM,CAAC,CAAA;GAAgF,EACvG,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,0BAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACb,KAAK,EAAA;IAACgB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GACxDN,eAAAA,KAAA,CAAAC,aAAA,CAACM,8BAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAI,GAAAC,iDAAA,CAAAJ,KAAA,EAAAK,SAAA,CAAA,CAAA;AAAA,IAAA,oBACvCd,KAAA,CAAAC,aAAA,CAACc,qCAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEN,EAAG;AACRO,MAAAA,SAAS,EAAEC,QAAE,CACTP,QAAQ,GAAGQ,2BAAO,CAACC,sBAAsB,GAAGD,2BAAO,CAACE,sBACxD,CAAE;MACFV,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAwB,iCAAA,CAAA;AACTN,MAAAA,GAAG,EAAEN,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPa,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,oCAAiB,CAACd,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CACX,CACc,CAAC,CAAA;GACvB,CACO,CACT,CAEA,CAAC,CAAA;AAExB;;;;"}
1
+ {"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\nimport { styled } from '@linaria/react';\nimport { popupBaseRootClass } from '@salutejs/plasma-core';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\nconst StyledPopup = styled(Popup)`\n & > .${popupBaseRootClass} {\n overflow: hidden;\n }\n`;\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n const Notification = useMemo(\n () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n [],\n );\n\n return (\n <PopupProvider>\n {notifications.length > 0 && (\n <StyledPopup isOpen frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n <StyledRoot>\n {notifications.map(({ id, isHidden, ...rest }) => (\n <StyledItemWrapper\n key={id}\n className={cx(\n isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n )}\n isHidden={isHidden || false}\n >\n <Notification\n key={id}\n id={id}\n onCloseButtonClick={() => closeNotification(id)}\n {...rest}\n />\n </StyledItemWrapper>\n ))}\n </StyledRoot>\n </StyledPopup>\n )}\n </PopupProvider>\n );\n};\n"],"names":["Popup","component","popupConfig","_exp","StyledPopup","styled","name","class","propsAsIs","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","isOpen","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;;;;;;AAcA;AACA,IAAMA,KAAK,gBAAGC,gBAAS,CAACC,mBAAW,CAAC,CAAA;AAAC,IAAAC,IAAA,GAdnBA,SAcmBA,IAAAA,GAAA;AAAA,EAAA,OAEVH,KAAK,CAAA;AAAA,CAAA,CAAA;AAAhC,IAAMI,WAAW,gBAAGC,cAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIzB,CAAA,CAAA;;AAED;AACA;AACA;IACaC,mBAAgD,GAAGA,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAAA,GAAAA,IAAAA,CAAAA,KAAAA,CAAAA;AACvE,EAAA,IAAAC,WAAA,GAA0BC,gBAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,aAAO,CACxB,YAAA;IAAA,OAAMhB,gBAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,0BAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACf,WAAW,EAAA;IAACkB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GAC9DN,eAAAA,KAAA,CAAAC,aAAA,CAACM,8BAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAAA,GAAAA,iDAAAA,CAAAA,KAAAA,EAAAA,SAAAA,CAAAA,CAAAA;AAAAA,IAAAA,oBACnCZ,KAAA,CAAAC,aAAA,CAACY,qCAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;AACRK,MAAAA,SAAS,EAAEC,QAAE,CACTL,QAAQ,GAAGM,2BAAO,CAACC,sBAAsB,GAAGD,2BAAO,CAACE,sBACxD,CAAE;MACFR,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAsB,iCAAA,CAAA;AACTN,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPW,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,oCAAiB,CAACZ,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}
@@ -0,0 +1 @@
1
+ .s19gbs9t > .popup-base-root{overflow:hidden;}
@@ -39,3 +39,5 @@
39
39
  .Notification_styles_7h8hp0_s92kmpm__2b784e15{font-family:var(--plasma-notification-content-font-family);font-size:var(--plasma-notification-content-font-size);font-style:var(--plasma-notification-content-font-style);font-weight:var(--plasma-notification-content-font-weight);-webkit-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-content-font-letter-spacing);letter-spacing:var(--plasma-notification-content-font-letter-spacing);line-height:var(--plasma-notification-content-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--plasma-notification-content-color);}
40
40
  .Notification_styles_7h8hp0_s18m0x6v__2b784e15{margin-top:1rem;opacity:1;}.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_notificationItemOpened__2b784e15{-webkit-animation:0.4s Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15 ease-out;animation:0.4s Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15 ease-out;}.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_notificationItemHidden__2b784e15{-webkit-animation:0.4s Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15 ease-out;animation:0.4s Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15 ease-out;}@-webkit-keyframes Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}@keyframes Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}
41
41
  .Notification_styles_7h8hp0_sfe5ql2__2b784e15{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;box-sizing:border-box;padding:0 1.5rem 1.5rem;max-height:100%;-webkit-align-items:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;align-items:flex-end;}
42
+
43
+ .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
package/cjs/index.css CHANGED
@@ -243,6 +243,8 @@
243
243
  .Popup_styles_141jyqa_p1cjo3us__ed39c2a3{position:relative;max-width:100%;pointer-events:all;}
244
244
  .Popup_styles_141jyqa_p5u7tqa__ed39c2a3{position:absolute;z-index:var(--p5u7tqa-0);left:var(--p5u7tqa-1);right:var(--p5u7tqa-2);top:var(--p5u7tqa-3);bottom:var(--p5u7tqa-4);-webkit-transform:var(--p5u7tqa-5);-ms-transform:var(--p5u7tqa-5);transform:var(--p5u7tqa-5);}
245
245
 
246
+ .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
247
+
246
248
  .base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea{width:var(--plasma-notification-width);padding:var(--plasma-notification-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationWithoutCloseIcon__4791b7ea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationOneLineTextbox__4791b7ea{padding:var(--plasma-notification-padding-one-line-textbox);}
247
249
 
248
250
  .base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificaitonContentBox__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd{padding:var(--plasma-notification-content-padding-top) var(--plasma-notification-content-padding-right) var(--plasma-notification-content-padding-bottom) var(--plasma-notification-content-padding-left);}.base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificaitonContentBox__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd.base_crlufx_notificationWithoutIcon__c6cc97dd{padding-top:var(--plasma-notification-content-padding-top-without-icon);}.base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificationCloseIcon__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd{top:var(--plasma-notification-close-icon-top);right:var(--plasma-notification-close-icon-right);}
@@ -5,8 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.NotificationsPortal = void 0;
8
+ var _base = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("@emotion/styled/base"));
8
9
  var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
10
  var _react2 = /*#__PURE__*/require("storeon/react");
11
+ var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
10
12
  var _Popup = /*#__PURE__*/require("../Popup");
11
13
  var _engines = /*#__PURE__*/require("../../engines");
12
14
  var _utils = /*#__PURE__*/require("../../utils");
@@ -16,11 +18,16 @@ var _Notification2 = /*#__PURE__*/require("./Notification.tokens");
16
18
  var _excluded = ["id", "isHidden"];
17
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
20
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
21
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
19
22
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
20
23
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
21
24
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
22
25
  // issue #823
23
26
  var Popup = /*#__PURE__*/(0, _engines.component)(_Popup.popupConfig);
27
+ var StyledPopup = /*#__PURE__*/(0, _base["default"])(Popup, {
28
+ target: "eefkyeq0",
29
+ label: "plasma-new-hope__StyledPopup"
30
+ })("&>.", _plasmaCore.popupBaseRootClass, "{overflow:hidden;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvTm90aWZpY2F0aW9uL05vdGlmaWNhdGlvbnNQb3J0YWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCaUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Ob3RpZmljYXRpb24vTm90aWZpY2F0aW9uc1BvcnRhbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgRkMsIEZvcndhcmRSZWZFeG90aWNDb21wb25lbnQsIFJlZkF0dHJpYnV0ZXMsIHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyB1c2VTdG9yZW9uIH0gZnJvbSAnc3RvcmVvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBwb3B1cEJhc2VSb290Q2xhc3MgfSBmcm9tICdAc2FsdXRlanMvcGxhc21hLWNvcmUnO1xuXG5pbXBvcnQgeyBQb3B1cFByb3ZpZGVyLCBwb3B1cENvbmZpZyB9IGZyb20gJy4uL1BvcHVwJztcbmltcG9ydCB7IGNvbXBvbmVudCB9IGZyb20gJy4uLy4uL2VuZ2luZXMnO1xuaW1wb3J0IHsgY3ggfSBmcm9tICcuLi8uLi91dGlscyc7XG5cbmltcG9ydCB7IE5vdGlmaWNhdGlvbnNTdGF0ZSwgTm90aWZpY2F0aW9uc0V2ZW50cywgY2xvc2VOb3RpZmljYXRpb24gfSBmcm9tICcuL05vdGlmaWNhdGlvbnNTdG9yZSc7XG5pbXBvcnQgeyBOb3RpZmljYXRpb25Qb3J0YWxQcm9wcywgTm90aWZpY2F0aW9uUHJvcHMgfSBmcm9tICcuL05vdGlmaWNhdGlvbi50eXBlcyc7XG5pbXBvcnQgeyBTdHlsZWRJdGVtV3JhcHBlciwgU3R5bGVkUm9vdCB9IGZyb20gJy4vTm90aWZpY2F0aW9uLnN0eWxlcyc7XG5pbXBvcnQgeyBjbGFzc2VzIH0gZnJvbSAnLi9Ob3RpZmljYXRpb24udG9rZW5zJztcblxuLy8gaXNzdWUgIzgyM1xuY29uc3QgUG9wdXAgPSBjb21wb25lbnQocG9wdXBDb25maWcpO1xuXG5jb25zdCBTdHlsZWRQb3B1cCA9IHN0eWxlZChQb3B1cClgXG4gICAgJiA+IC4ke3BvcHVwQmFzZVJvb3RDbGFzc30ge1xuICAgICAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIH1cbmA7XG5cbi8qKlxuICog0J7QsdC10YDRgtC60LAg0LTQu9GPINCy0LjQt9GD0LDQu9GM0L3QvtCz0L4g0L/RgNC10LTRgdGC0LDQstC70LXQvdC40Y8g0YPQstC10LTQvtC80LvQtdC90LjQuS5cbiAqL1xuZXhwb3J0IGNvbnN0IE5vdGlmaWNhdGlvbnNQb3J0YWw6IEZDPE5vdGlmaWNhdGlvblBvcnRhbFByb3BzPiA9ICh7IGNvbmZpZywgZnJhbWUgfSkgPT4ge1xuICAgIGNvbnN0IHsgbm90aWZpY2F0aW9ucyB9ID0gdXNlU3RvcmVvbjxOb3RpZmljYXRpb25zU3RhdGUsIE5vdGlmaWNhdGlvbnNFdmVudHM+KCdub3RpZmljYXRpb25zJyk7XG5cbiAgICBjb25zdCBOb3RpZmljYXRpb24gPSB1c2VNZW1vKFxuICAgICAgICAoKSA9PiBjb21wb25lbnQoY29uZmlnKSBhcyBGb3J3YXJkUmVmRXhvdGljQ29tcG9uZW50PE5vdGlmaWNhdGlvblByb3BzICYgUmVmQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4+LFxuICAgICAgICBbXSxcbiAgICApO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPFBvcHVwUHJvdmlkZXI+XG4gICAgICAgICAgICB7bm90aWZpY2F0aW9ucy5sZW5ndGggPiAwICYmIChcbiAgICAgICAgICAgICAgICA8U3R5bGVkUG9wdXAgaXNPcGVuIGZyYW1lPXtmcmFtZX0gcGxhY2VtZW50PVwiYm90dG9tLXJpZ2h0XCIgekluZGV4PVwiOTEwMFwiPlxuICAgICAgICAgICAgICAgICAgICA8U3R5bGVkUm9vdD5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtub3RpZmljYXRpb25zLm1hcCgoeyBpZCwgaXNIaWRkZW4sIC4uLnJlc3QgfSkgPT4gKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxTdHlsZWRJdGVtV3JhcHBlclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBrZXk9e2lkfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaXNIaWRkZW4gPyBjbGFzc2VzLm5vdGlmaWNhdGlvbkl0ZW1IaWRkZW4gOiBjbGFzc2VzLm5vdGlmaWNhdGlvbkl0ZW1PcGVuZWQsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGlzSGlkZGVuPXtpc0hpZGRlbiB8fCBmYWxzZX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxOb3RpZmljYXRpb25cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGtleT17aWR9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvbkNsb3NlQnV0dG9uQ2xpY2s9eygpID0+IGNsb3NlTm90aWZpY2F0aW9uKGlkKX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHsuLi5yZXN0fVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvU3R5bGVkSXRlbVdyYXBwZXI+XG4gICAgICAgICAgICAgICAgICAgICAgICApKX1cbiAgICAgICAgICAgICAgICAgICAgPC9TdHlsZWRSb290PlxuICAgICAgICAgICAgICAgIDwvU3R5bGVkUG9wdXA+XG4gICAgICAgICAgICApfVxuICAgICAgICA8L1BvcHVwUHJvdmlkZXI+XG4gICAgKTtcbn07XG4iXX0= */"));
24
31
 
25
32
  /**
26
33
  * Обертка для визуального представления уведомлений.
@@ -33,7 +40,7 @@ var NotificationsPortal = exports.NotificationsPortal = function NotificationsPo
33
40
  var Notification = (0, _react.useMemo)(function () {
34
41
  return (0, _engines.component)(config);
35
42
  }, []);
36
- return /*#__PURE__*/_react["default"].createElement(_Popup.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/_react["default"].createElement(Popup, {
43
+ return /*#__PURE__*/_react["default"].createElement(_Popup.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/_react["default"].createElement(StyledPopup, {
37
44
  isOpen: true,
38
45
  frame: frame,
39
46
  placement: "bottom-right",
@@ -1,9 +1,11 @@
1
+ import _styled from "@emotion/styled/base";
1
2
  var _excluded = ["id", "isHidden"];
2
3
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
3
4
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
4
5
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
5
6
  import React, { useMemo } from 'react';
6
7
  import { useStoreon } from 'storeon/react';
8
+ import { popupBaseRootClass } from '@salutejs/plasma-core';
7
9
  import { PopupProvider, popupConfig } from '../Popup';
8
10
  import { component } from '../../engines';
9
11
  import { cx } from '../../utils';
@@ -13,6 +15,10 @@ import { classes } from './Notification.tokens';
13
15
 
14
16
  // issue #823
15
17
  var Popup = /*#__PURE__*/component(popupConfig);
18
+ var StyledPopup = /*#__PURE__*/_styled(Popup, {
19
+ target: "eefkyeq0",
20
+ label: "plasma-new-hope__StyledPopup"
21
+ })("&>.", popupBaseRootClass, "{overflow:hidden;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvTm90aWZpY2F0aW9uL05vdGlmaWNhdGlvbnNQb3J0YWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCaUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Ob3RpZmljYXRpb24vTm90aWZpY2F0aW9uc1BvcnRhbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgRkMsIEZvcndhcmRSZWZFeG90aWNDb21wb25lbnQsIFJlZkF0dHJpYnV0ZXMsIHVzZU1lbW8gfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyB1c2VTdG9yZW9uIH0gZnJvbSAnc3RvcmVvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBwb3B1cEJhc2VSb290Q2xhc3MgfSBmcm9tICdAc2FsdXRlanMvcGxhc21hLWNvcmUnO1xuXG5pbXBvcnQgeyBQb3B1cFByb3ZpZGVyLCBwb3B1cENvbmZpZyB9IGZyb20gJy4uL1BvcHVwJztcbmltcG9ydCB7IGNvbXBvbmVudCB9IGZyb20gJy4uLy4uL2VuZ2luZXMnO1xuaW1wb3J0IHsgY3ggfSBmcm9tICcuLi8uLi91dGlscyc7XG5cbmltcG9ydCB7IE5vdGlmaWNhdGlvbnNTdGF0ZSwgTm90aWZpY2F0aW9uc0V2ZW50cywgY2xvc2VOb3RpZmljYXRpb24gfSBmcm9tICcuL05vdGlmaWNhdGlvbnNTdG9yZSc7XG5pbXBvcnQgeyBOb3RpZmljYXRpb25Qb3J0YWxQcm9wcywgTm90aWZpY2F0aW9uUHJvcHMgfSBmcm9tICcuL05vdGlmaWNhdGlvbi50eXBlcyc7XG5pbXBvcnQgeyBTdHlsZWRJdGVtV3JhcHBlciwgU3R5bGVkUm9vdCB9IGZyb20gJy4vTm90aWZpY2F0aW9uLnN0eWxlcyc7XG5pbXBvcnQgeyBjbGFzc2VzIH0gZnJvbSAnLi9Ob3RpZmljYXRpb24udG9rZW5zJztcblxuLy8gaXNzdWUgIzgyM1xuY29uc3QgUG9wdXAgPSBjb21wb25lbnQocG9wdXBDb25maWcpO1xuXG5jb25zdCBTdHlsZWRQb3B1cCA9IHN0eWxlZChQb3B1cClgXG4gICAgJiA+IC4ke3BvcHVwQmFzZVJvb3RDbGFzc30ge1xuICAgICAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIH1cbmA7XG5cbi8qKlxuICog0J7QsdC10YDRgtC60LAg0LTQu9GPINCy0LjQt9GD0LDQu9GM0L3QvtCz0L4g0L/RgNC10LTRgdGC0LDQstC70LXQvdC40Y8g0YPQstC10LTQvtC80LvQtdC90LjQuS5cbiAqL1xuZXhwb3J0IGNvbnN0IE5vdGlmaWNhdGlvbnNQb3J0YWw6IEZDPE5vdGlmaWNhdGlvblBvcnRhbFByb3BzPiA9ICh7IGNvbmZpZywgZnJhbWUgfSkgPT4ge1xuICAgIGNvbnN0IHsgbm90aWZpY2F0aW9ucyB9ID0gdXNlU3RvcmVvbjxOb3RpZmljYXRpb25zU3RhdGUsIE5vdGlmaWNhdGlvbnNFdmVudHM+KCdub3RpZmljYXRpb25zJyk7XG5cbiAgICBjb25zdCBOb3RpZmljYXRpb24gPSB1c2VNZW1vKFxuICAgICAgICAoKSA9PiBjb21wb25lbnQoY29uZmlnKSBhcyBGb3J3YXJkUmVmRXhvdGljQ29tcG9uZW50PE5vdGlmaWNhdGlvblByb3BzICYgUmVmQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4+LFxuICAgICAgICBbXSxcbiAgICApO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPFBvcHVwUHJvdmlkZXI+XG4gICAgICAgICAgICB7bm90aWZpY2F0aW9ucy5sZW5ndGggPiAwICYmIChcbiAgICAgICAgICAgICAgICA8U3R5bGVkUG9wdXAgaXNPcGVuIGZyYW1lPXtmcmFtZX0gcGxhY2VtZW50PVwiYm90dG9tLXJpZ2h0XCIgekluZGV4PVwiOTEwMFwiPlxuICAgICAgICAgICAgICAgICAgICA8U3R5bGVkUm9vdD5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtub3RpZmljYXRpb25zLm1hcCgoeyBpZCwgaXNIaWRkZW4sIC4uLnJlc3QgfSkgPT4gKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxTdHlsZWRJdGVtV3JhcHBlclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBrZXk9e2lkfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaXNIaWRkZW4gPyBjbGFzc2VzLm5vdGlmaWNhdGlvbkl0ZW1IaWRkZW4gOiBjbGFzc2VzLm5vdGlmaWNhdGlvbkl0ZW1PcGVuZWQsXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGlzSGlkZGVuPXtpc0hpZGRlbiB8fCBmYWxzZX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxOb3RpZmljYXRpb25cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGtleT17aWR9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvbkNsb3NlQnV0dG9uQ2xpY2s9eygpID0+IGNsb3NlTm90aWZpY2F0aW9uKGlkKX1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHsuLi5yZXN0fVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvU3R5bGVkSXRlbVdyYXBwZXI+XG4gICAgICAgICAgICAgICAgICAgICAgICApKX1cbiAgICAgICAgICAgICAgICAgICAgPC9TdHlsZWRSb290PlxuICAgICAgICAgICAgICAgIDwvU3R5bGVkUG9wdXA+XG4gICAgICAgICAgICApfVxuICAgICAgICA8L1BvcHVwUHJvdmlkZXI+XG4gICAgKTtcbn07XG4iXX0= */"));
16
22
 
17
23
  /**
18
24
  * Обертка для визуального представления уведомлений.
@@ -25,7 +31,7 @@ export var NotificationsPortal = function NotificationsPortal(_ref) {
25
31
  var Notification = useMemo(function () {
26
32
  return component(config);
27
33
  }, []);
28
- return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(Popup, {
34
+ return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(StyledPopup, {
29
35
  isOpen: true,
30
36
  frame: frame,
31
37
  placement: "bottom-right",
@@ -1,6 +1,8 @@
1
+ import './NotificationsPortal_6417q6.css';
1
2
  import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
3
  import React, { useMemo } from 'react';
3
4
  import { useStoreon } from 'storeon/react';
5
+ import { styled } from '@linaria/react';
4
6
  import { PopupProvider } from '../Popup/PopupContext.js';
5
7
  import { popupConfig } from '../Popup/Popup.js';
6
8
  import '@linaria/core';
@@ -14,6 +16,14 @@ var _excluded = ["id", "isHidden"];
14
16
 
15
17
  // issue #823
16
18
  var Popup = /*#__PURE__*/component(popupConfig);
19
+ var _exp = function _exp() {
20
+ return Popup;
21
+ };
22
+ var StyledPopup = /*#__PURE__*/styled(_exp())({
23
+ name: "StyledPopup",
24
+ "class": "s19gbs9t",
25
+ propsAsIs: true
26
+ });
17
27
 
18
28
  /**
19
29
  * Обертка для визуального представления уведомлений.
@@ -26,7 +36,7 @@ var NotificationsPortal = function NotificationsPortal(_ref) {
26
36
  var Notification = useMemo(function () {
27
37
  return component(config);
28
38
  }, []);
29
- return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(Popup, {
39
+ return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(StyledPopup, {
30
40
  isOpen: true,
31
41
  frame: frame,
32
42
  placement: "bottom-right",
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n const Notification = useMemo(\n () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n [],\n );\n\n return (\n <PopupProvider>\n {notifications.length > 0 && (\n <Popup isOpen frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n <StyledRoot>\n {notifications.map(({ id, isHidden, ...rest }) => (\n <StyledItemWrapper\n key={id}\n className={cx(\n isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n )}\n isHidden={isHidden || false}\n >\n <Notification\n key={id}\n id={id}\n onCloseButtonClick={() => closeNotification(id)}\n {...rest}\n />\n </StyledItemWrapper>\n ))}\n </StyledRoot>\n </Popup>\n )}\n </PopupProvider>\n );\n};\n"],"names":["Popup","component","popupConfig","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","isOpen","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","_objectWithoutProperties","_excluded","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;AAYA;AACA,IAAMA,KAAK,gBAAGC,SAAS,CAACC,WAAW,CAAC,CAAA;;AAEpC;AACA;AACA;IACaC,mBAAgD,GAAG,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK,CAAA;AAC5E,EAAA,IAAAC,WAAA,GAA0BC,UAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAa,GAAAF,WAAA,CAAbE,aAAa,CAAA;EAErB,IAAMC,YAAY,GAAGC,OAAO,CACxB,YAAA;IAAA,OAAMV,SAAS,CAACI,MAAM,CAAC,CAAA;GAAgF,EACvG,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,aAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACb,KAAK,EAAA;IAACgB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GACxDN,eAAAA,KAAA,CAAAC,aAAA,CAACM,UAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAI,GAAAC,wBAAA,CAAAJ,KAAA,EAAAK,SAAA,CAAA,CAAA;AAAA,IAAA,oBACvCd,KAAA,CAAAC,aAAA,CAACc,iBAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEN,EAAG;AACRO,MAAAA,SAAS,EAAEC,EAAE,CACTP,QAAQ,GAAGQ,OAAO,CAACC,sBAAsB,GAAGD,OAAO,CAACE,sBACxD,CAAE;MACFV,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAwB,QAAA,CAAA;AACTN,MAAAA,GAAG,EAAEN,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPa,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,iBAAiB,CAACd,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CACX,CACc,CAAC,CAAA;GACvB,CACO,CACT,CAEA,CAAC,CAAA;AAExB;;;;"}
1
+ {"version":3,"file":"NotificationsPortal.js","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"sourcesContent":["import React, { FC, ForwardRefExoticComponent, RefAttributes, useMemo } from 'react';\nimport { useStoreon } from 'storeon/react';\nimport { styled } from '@linaria/react';\nimport { popupBaseRootClass } from '@salutejs/plasma-core';\n\nimport { PopupProvider, popupConfig } from '../Popup';\nimport { component } from '../../engines';\nimport { cx } from '../../utils';\n\nimport { NotificationsState, NotificationsEvents, closeNotification } from './NotificationsStore';\nimport { NotificationPortalProps, NotificationProps } from './Notification.types';\nimport { StyledItemWrapper, StyledRoot } from './Notification.styles';\nimport { classes } from './Notification.tokens';\n\n// issue #823\nconst Popup = component(popupConfig);\n\nconst StyledPopup = styled(Popup)`\n & > .${popupBaseRootClass} {\n overflow: hidden;\n }\n`;\n\n/**\n * Обертка для визуального представления уведомлений.\n */\nexport const NotificationsPortal: FC<NotificationPortalProps> = ({ config, frame }) => {\n const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n const Notification = useMemo(\n () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n [],\n );\n\n return (\n <PopupProvider>\n {notifications.length > 0 && (\n <StyledPopup isOpen frame={frame} placement=\"bottom-right\" zIndex=\"9100\">\n <StyledRoot>\n {notifications.map(({ id, isHidden, ...rest }) => (\n <StyledItemWrapper\n key={id}\n className={cx(\n isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n )}\n isHidden={isHidden || false}\n >\n <Notification\n key={id}\n id={id}\n onCloseButtonClick={() => closeNotification(id)}\n {...rest}\n />\n </StyledItemWrapper>\n ))}\n </StyledRoot>\n </StyledPopup>\n )}\n </PopupProvider>\n );\n};\n"],"names":["Popup","component","popupConfig","_exp","StyledPopup","styled","name","class","propsAsIs","NotificationsPortal","_ref","config","frame","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","isOpen","placement","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","_extends","onCloseButtonClick","closeNotification"],"mappings":";;;;;;;;;;;;;;;AAcA;AACA,IAAMA,KAAK,gBAAGC,SAAS,CAACC,WAAW,CAAC,CAAA;AAAC,IAAAC,IAAA,GAdnBA,SAcmBA,IAAAA,GAAA;AAAA,EAAA,OAEVH,KAAK,CAAA;AAAA,CAAA,CAAA;AAAhC,IAAMI,WAAW,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,aAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAIzB,CAAA,CAAA;;AAED;AACA;AACA;IACaC,mBAAgD,GAAGA,SAAnDA,mBAAgDA,CAAAC,IAAA,EAA0B;AAAA,EAAA,IAApBC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAAA,GAAAA,IAAAA,CAAAA,KAAAA,CAAAA;AACvE,EAAA,IAAAC,WAAA,GAA0BC,UAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,OAAO,CACxB,YAAA;IAAA,OAAMhB,SAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAED,EAAA,oBACIO,KAAA,CAAAC,aAAA,CAACC,aAAa,QACTL,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,KAAA,CAAAC,aAAA,CAACf,WAAW,EAAA;IAACkB,MAAM,EAAA,IAAA;AAACV,IAAAA,KAAK,EAAEA,KAAM;AAACW,IAAAA,SAAS,EAAC,cAAc;AAACC,IAAAA,MAAM,EAAC,MAAA;GAC9DN,eAAAA,KAAA,CAAAC,aAAA,CAACM,UAAU,EACNV,IAAAA,EAAAA,aAAa,CAACW,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGC,EAAE,GAAAD,KAAA,CAAFC,EAAE;MAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,MAAAA,IAAAA,GAAAA,wBAAAA,CAAAA,KAAAA,EAAAA,SAAAA,CAAAA,CAAAA;AAAAA,IAAAA,oBACnCZ,KAAA,CAAAC,aAAA,CAACY,iBAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;AACRK,MAAAA,SAAS,EAAEC,EAAE,CACTL,QAAQ,GAAGM,OAAO,CAACC,sBAAsB,GAAGD,OAAO,CAACE,sBACxD,CAAE;MACFR,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BX,KAAA,CAAAC,aAAA,CAACH,YAAY,EAAAsB,QAAA,CAAA;AACTN,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPW,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,iBAAiB,CAACZ,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}
@@ -0,0 +1 @@
1
+ .s19gbs9t > .popup-base-root{overflow:hidden;}
@@ -39,3 +39,5 @@
39
39
  .Notification_styles_7h8hp0_s92kmpm__2b784e15{font-family:var(--plasma-notification-content-font-family);font-size:var(--plasma-notification-content-font-size);font-style:var(--plasma-notification-content-font-style);font-weight:var(--plasma-notification-content-font-weight);-webkit-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-content-font-letter-spacing);letter-spacing:var(--plasma-notification-content-font-letter-spacing);line-height:var(--plasma-notification-content-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--plasma-notification-content-color);}
40
40
  .Notification_styles_7h8hp0_s18m0x6v__2b784e15{margin-top:1rem;opacity:1;}.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_notificationItemOpened__2b784e15{-webkit-animation:0.4s Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15 ease-out;animation:0.4s Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15 ease-out;}.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_s18m0x6v__2b784e15.Notification_styles_7h8hp0_notificationItemHidden__2b784e15{-webkit-animation:0.4s Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15 ease-out;animation:0.4s Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15 ease-out;}@-webkit-keyframes Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_7h8hp0_showAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}@keyframes Notification_styles_7h8hp0_hideAnimationS18m0x6v__2b784e15{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}
41
41
  .Notification_styles_7h8hp0_sfe5ql2__2b784e15{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;box-sizing:border-box;padding:0 1.5rem 1.5rem;max-height:100%;-webkit-align-items:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;align-items:flex-end;}
42
+
43
+ .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
package/es/index.css CHANGED
@@ -243,6 +243,8 @@
243
243
  .Popup_styles_141jyqa_p1cjo3us__ed39c2a3{position:relative;max-width:100%;pointer-events:all;}
244
244
  .Popup_styles_141jyqa_p5u7tqa__ed39c2a3{position:absolute;z-index:var(--p5u7tqa-0);left:var(--p5u7tqa-1);right:var(--p5u7tqa-2);top:var(--p5u7tqa-3);bottom:var(--p5u7tqa-4);-webkit-transform:var(--p5u7tqa-5);-ms-transform:var(--p5u7tqa-5);transform:var(--p5u7tqa-5);}
245
245
 
246
+ .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
247
+
246
248
  .base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea{width:var(--plasma-notification-width);padding:var(--plasma-notification-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationWithoutCloseIcon__4791b7ea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationOneLineTextbox__4791b7ea{padding:var(--plasma-notification-padding-one-line-textbox);}
247
249
 
248
250
  .base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificaitonContentBox__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd{padding:var(--plasma-notification-content-padding-top) var(--plasma-notification-content-padding-right) var(--plasma-notification-content-padding-bottom) var(--plasma-notification-content-padding-left);}.base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificaitonContentBox__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd.base_crlufx_notificationWithoutIcon__c6cc97dd{padding-top:var(--plasma-notification-content-padding-top-without-icon);}.base_crlufx_bmb6i7f__c6cc97dd .base_crlufx_notificationCloseIcon__c6cc97dd.base_crlufx_notificationLayoutVertical__c6cc97dd{top:var(--plasma-notification-close-icon-top);right:var(--plasma-notification-close-icon-right);}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.119.0-dev.0",
3
+ "version": "0.119.1-dev.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -118,5 +118,5 @@
118
118
  "react-popper": "2.3.0",
119
119
  "storeon": "3.1.5"
120
120
  },
121
- "gitHead": "5bb7845f81bc69aa2e89a49e28e7b40a391718b8"
121
+ "gitHead": "8b8c59cfcd1dd0f39d830a3f38c88049b7485175"
122
122
  }
@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.NotificationsPortal = void 0;
8
8
  var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
9
  var _react2 = /*#__PURE__*/require("storeon/react");
10
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
11
+ var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
10
12
  var _Popup = /*#__PURE__*/require("../Popup");
11
13
  var _engines = /*#__PURE__*/require("../../engines");
12
14
  var _utils = /*#__PURE__*/require("../../utils");
@@ -14,6 +16,7 @@ var _NotificationsStore = /*#__PURE__*/require("./NotificationsStore");
14
16
  var _Notification = /*#__PURE__*/require("./Notification.styles");
15
17
  var _Notification2 = /*#__PURE__*/require("./Notification.tokens");
16
18
  var _excluded = ["id", "isHidden"];
19
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
20
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
21
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
19
22
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -21,6 +24,9 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
21
24
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
22
25
  // issue #823
23
26
  var Popup = /*#__PURE__*/(0, _engines.component)(_Popup.popupConfig);
27
+ var StyledPopup = /*#__PURE__*/(0, _styledComponents["default"])(Popup).withConfig({
28
+ componentId: "plasma-new-hope__sc-9pvo2x-0"
29
+ })(["& > .", "{overflow:hidden;}"], _plasmaCore.popupBaseRootClass);
24
30
 
25
31
  /**
26
32
  * Обертка для визуального представления уведомлений.
@@ -33,7 +39,7 @@ var NotificationsPortal = exports.NotificationsPortal = function NotificationsPo
33
39
  var Notification = (0, _react.useMemo)(function () {
34
40
  return (0, _engines.component)(config);
35
41
  }, []);
36
- return /*#__PURE__*/_react["default"].createElement(_Popup.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/_react["default"].createElement(Popup, {
42
+ return /*#__PURE__*/_react["default"].createElement(_Popup.PopupProvider, null, notifications.length > 0 && /*#__PURE__*/_react["default"].createElement(StyledPopup, {
37
43
  isOpen: true,
38
44
  frame: frame,
39
45
  placement: "bottom-right",
@@ -4,6 +4,8 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
4
4
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
5
5
  import React, { useMemo } from 'react';
6
6
  import { useStoreon } from 'storeon/react';
7
+ import styled from 'styled-components';
8
+ import { popupBaseRootClass } from '@salutejs/plasma-core';
7
9
  import { PopupProvider, popupConfig } from '../Popup';
8
10
  import { component } from '../../engines';
9
11
  import { cx } from '../../utils';
@@ -13,6 +15,9 @@ import { classes } from './Notification.tokens';
13
15
 
14
16
  // issue #823
15
17
  var Popup = /*#__PURE__*/component(popupConfig);
18
+ var StyledPopup = /*#__PURE__*/styled(Popup).withConfig({
19
+ componentId: "plasma-new-hope__sc-9pvo2x-0"
20
+ })(["& > .", "{overflow:hidden;}"], popupBaseRootClass);
16
21
 
17
22
  /**
18
23
  * Обертка для визуального представления уведомлений.
@@ -25,7 +30,7 @@ export var NotificationsPortal = function NotificationsPortal(_ref) {
25
30
  var Notification = useMemo(function () {
26
31
  return component(config);
27
32
  }, []);
28
- return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(Popup, {
33
+ return /*#__PURE__*/React.createElement(PopupProvider, null, notifications.length > 0 && /*#__PURE__*/React.createElement(StyledPopup, {
29
34
  isOpen: true,
30
35
  frame: frame,
31
36
  placement: "bottom-right",
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAQrF,OAAO,EAAE,uBAAuB,EAAqB,MAAM,sBAAsB,CAAC;AAOlF;;GAEG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,uBAAuB,CAkC3D,CAAC"}
1
+ {"version":3,"file":"NotificationsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAUrF,OAAO,EAAE,uBAAuB,EAAqB,MAAM,sBAAsB,CAAC;AAalF;;GAEG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,uBAAuB,CAkC3D,CAAC"}