@salutejs/plasma-new-hope 0.271.0-canary.1778.13392217490.0 → 0.271.0-dev.0

package/cjs/components/Notification/Notification.css

@@ -30,14 +30,14 @@
 .Button_styles_8cvmld_s1rjh7ra__4694a0fa{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-self:var(--plasma-button-right-content-align-self);-ms-flex-item-align:var(--plasma-button-right-content-align);align-self:var(--plasma-button-right-content-align-self);margin:var(--s1rjh7ra-0);}
 .Button_styles_8cvmld_b9ga1dj__4694a0fa{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma_private-btn-br:var(--plasma_computed-btn-br);border-radius:var(--plasma_private-btn-br);}a.Button_styles_8cvmld_b9ga1dj__4694a0fa{-webkit-text-decoration:none;text-decoration:none;}.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_buttonSquare__4694a0fa{width:var(--plasma-button-height);padding:0;}
 
-.Notification_styles_gk4bgs_sb12p__85070c43{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
-.Notification_styles_gk4bgs_crvd7hm__85070c43{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_gk4bgs_crvd7hm__85070c43:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_gk4bgs_crvd7hm__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{position:relative;}
-.Notification_styles_gk4bgs_wg1ga5v__85070c43{position:relative;box-sizing:border-box;background:var(--plasma-notification-backgorund);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.Notification_styles_gk4bgs_wg1ga5v__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
-.Notification_styles_gk4bgs_b1amsn8a__85070c43{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_gk4bgs_b1amsn8a__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{margin-top:unset;margin-left:unset;}
-.Notification_styles_gk4bgs_i14raqr9__85070c43{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.Notification_styles_gk4bgs_i14raqr9__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
-.Notification_styles_gk4bgs_c157peez__85070c43{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_gk4bgs_c157peez__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
-.Notification_styles_gk4bgs_t1vmb0f2__85070c43{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_gk4bgs_t1vmb0f2__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{padding:unset;}
-.Notification_styles_gk4bgs_s1k4e58v__85070c43{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
-.Notification_styles_gk4bgs_s92kmpm__85070c43{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);}
-.Notification_styles_gk4bgs_s18m0x6v__85070c43{margin-top:1rem;opacity:1;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemOpened__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemOpened__85070c43.Notification_styles_gk4bgs_notificationLeftToRightAnimation__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemHidden__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_hideAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_hideAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemHidden__85070c43.Notification_styles_gk4bgs_notificationLeftToRightAnimation__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43 ease-out;}@-webkit-keyframes Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43{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;}}@-webkit-keyframes Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43{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_gk4bgs_showAnimationS18m0x6v__85070c43{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_gk4bgs_hideAnimationS18m0x6v__85070c43{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_gk4bgs_hideAnimationS18m0x6v__85070c43{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;}}
-.Notification_styles_gk4bgs_sfe5ql2__85070c43{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:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}
+.Notification_styles_1u5gusp_sb12p__dcdf3719{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
+.Notification_styles_1u5gusp_crvd7hm__dcdf3719{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_1u5gusp_crvd7hm__dcdf3719:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_1u5gusp_crvd7hm__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{position:relative;}
+.Notification_styles_1u5gusp_wg1ga5v__dcdf3719{position:relative;box-sizing:border-box;background:var(--plasma-notification-backgorund);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.Notification_styles_1u5gusp_wg1ga5v__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
+.Notification_styles_1u5gusp_b1amsn8a__dcdf3719{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_1u5gusp_b1amsn8a__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{margin-top:unset;margin-left:unset;}
+.Notification_styles_1u5gusp_i14raqr9__dcdf3719{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);margin-right:var(--i14raqr9-0);margin-bottom:var(--i14raqr9-1);}.Notification_styles_1u5gusp_i14raqr9__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
+.Notification_styles_1u5gusp_c157peez__dcdf3719{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_1u5gusp_c157peez__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
+.Notification_styles_1u5gusp_t1vmb0f2__dcdf3719{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_1u5gusp_t1vmb0f2__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{padding:unset;}
+.Notification_styles_1u5gusp_s1k4e58v__dcdf3719{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
+.Notification_styles_1u5gusp_s92kmpm__dcdf3719{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);}
+.Notification_styles_1u5gusp_s18m0x6v__dcdf3719{margin-top:1rem;opacity:1;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemOpened__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemOpened__dcdf3719.Notification_styles_1u5gusp_notificationLeftToRightAnimation__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemHidden__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_hideAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_hideAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemHidden__dcdf3719.Notification_styles_1u5gusp_notificationLeftToRightAnimation__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;}@-webkit-keyframes Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719{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;}}@-webkit-keyframes Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719{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_1u5gusp_showAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideAnimationS18m0x6v__dcdf3719{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;}}
+.Notification_styles_1u5gusp_sfe5ql2__dcdf3719{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:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}

package/cjs/components/Notification/Notification.js

@@ -20,7 +20,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefault(React);
 
-var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "textColor", "iconColor", "onCloseButtonClick"];
+var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "onCloseButtonClick"];
 
 /**
  * Компонент для небольших уведомлений пользователя
@@ -41,8 +41,6 @@ var notificationRoot = function notificationRoot(Root) {
       layout = _props$layout === void 0 ? Notification_types.layouts.vertical : _props$layout,
       icon = props.icon,
       closeIconType = props.closeIconType,
-      textColor = props.textColor,
-      iconColor = props.iconColor,
       onCloseButtonClick = props.onCloseButtonClick,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
     var ariaLive = 'polite';
@@ -75,15 +73,13 @@ var notificationRoot = function notificationRoot(Root) {
       className: index.cx(Notification_tokens.classes.contentBox, index$1.getLayoutClass(layout), withoutIconClass)
     }, icon && /*#__PURE__*/React__default.default.createElement(Notification_styles.IconWrapper, {
       iconPlacement: IconPlacementInternal,
-      className: index.cx(Notification_tokens.classes.icon, index$1.getLayoutClass(layout)),
-      iconColor: iconColor
+      className: index.cx(Notification_tokens.classes.icon, index$1.getLayoutClass(layout))
     }, icon), /*#__PURE__*/React__default.default.createElement(Notification_styles.TextBox, {
       iconPlacement: IconPlacementInternal,
       showCloseIcon: showCloseIcon,
       className: index.cx(Notification_tokens.classes.textbox, index$1.getLayoutClass(layout))
     }, title && /*#__PURE__*/React__default.default.createElement(Notification_styles.StyledTitle, {
-      className: Notification_tokens.classes.title,
-      textColor: textColor
+      className: Notification_tokens.classes.title
     }, title), content && /*#__PURE__*/React__default.default.createElement(Notification_styles.StyledContent, {
       className: Notification_tokens.classes.text
     }, content))), actions && /*#__PURE__*/React__default.default.createElement(Notification_styles.ButtonsWrapper, {

package/cjs/components/Notification/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n    ButtonsWrapper,\n    CloseIconWrapper,\n    ContentBox,\n    IconWrapper,\n    StyledContent,\n    StyledNotification,\n    StyledTitle,\n    TextBox,\n    Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n    forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n        const {\n            role = 'status',\n            title,\n            children: content,\n            actions,\n            view,\n            size,\n            iconPlacement,\n            showCloseIcon = true,\n            layout = layouts.vertical as NotificationLayout,\n            icon,\n            closeIconType,\n            textColor,\n            iconColor,\n            onCloseButtonClick,\n            ...rest\n        } = props;\n\n        let ariaLive: 'assertive' | 'polite' = 'polite';\n        let ariaAtomic = false;\n\n        if (role === 'alert') {\n            ariaLive = 'assertive';\n        } else if (role === 'status') {\n            ariaAtomic = true;\n        }\n\n        const isOneLine = !content || !title;\n        const oneLineClass = isOneLine ? classes.oneLine : undefined;\n        const withoutIconClass = icon ? undefined : classes.withoutIcon;\n        const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n        const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n        return (\n            <Root\n                view={view}\n                size={size}\n                layout={layout}\n                closeIconType={closeIconType}\n                ref={ref}\n                role={role}\n                aria-live={ariaLive}\n                aria-atomic={ariaAtomic}\n                {...rest}\n            >\n                <Wrapper className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}>\n                    <ContentBox\n                        iconPlacement={IconPlacementInternal}\n                        className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n                    >\n                        {icon && (\n                            <IconWrapper\n                                iconPlacement={IconPlacementInternal}\n                                className={cx(classes.icon, getLayoutClass(layout))}\n                                iconColor={iconColor}\n                            >\n                                {icon}\n                            </IconWrapper>\n                        )}\n                        <TextBox\n                            iconPlacement={IconPlacementInternal}\n                            showCloseIcon={showCloseIcon}\n                            className={cx(classes.textbox, getLayoutClass(layout))}\n                        >\n                            {title && (\n                                <StyledTitle className={classes.title} textColor={textColor}>\n                                    {title}\n                                </StyledTitle>\n                            )}\n                            {content && <StyledContent className={classes.text}>{content}</StyledContent>}\n                        </TextBox>\n                    </ContentBox>\n                    {actions && (\n                        <ButtonsWrapper\n                            iconPlacement={IconPlacementInternal}\n                            className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n                        >\n                            {actions}\n                        </ButtonsWrapper>\n                    )}\n\n                    {showCloseIcon && (\n                        <CloseIconWrapper\n                            view=\"clear\"\n                            size=\"s\"\n                            onClick={onCloseButtonClick}\n                            className={cx(classes.closeIcon, getLayoutClass(layout))}\n                        >\n                            {closeIconType === 'default' ? (\n                                <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            ) : (\n                                <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            )}\n                        </CloseIconWrapper>\n                    )}\n                </Wrapper>\n            </Root>\n        );\n    });\n\nexport const notificationConfig = {\n    name: 'Notification',\n    tag: 'div',\n    layout: notificationRoot,\n    base: StyledNotification,\n    variations: {\n        layout: {\n            css: layoutCSS,\n        },\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        closeIconType: {\n            css: closeIconTypeCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        layout: layouts.vertical,\n        size: 'xs',\n        closeIconType: 'default',\n    },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","textColor","iconColor","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}
+{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n    ButtonsWrapper,\n    CloseIconWrapper,\n    ContentBox,\n    IconWrapper,\n    StyledContent,\n    StyledNotification,\n    StyledTitle,\n    TextBox,\n    Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n    forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n        const {\n            role = 'status',\n            title,\n            children: content,\n            actions,\n            view,\n            size,\n            iconPlacement,\n            showCloseIcon = true,\n            layout = layouts.vertical as NotificationLayout,\n            icon,\n            closeIconType,\n            onCloseButtonClick,\n            ...rest\n        } = props;\n\n        let ariaLive: 'assertive' | 'polite' = 'polite';\n        let ariaAtomic = false;\n\n        if (role === 'alert') {\n            ariaLive = 'assertive';\n        } else if (role === 'status') {\n            ariaAtomic = true;\n        }\n\n        const isOneLine = !content || !title;\n        const oneLineClass = isOneLine ? classes.oneLine : undefined;\n        const withoutIconClass = icon ? undefined : classes.withoutIcon;\n        const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n        const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n        return (\n            <Root\n                view={view}\n                size={size}\n                layout={layout}\n                closeIconType={closeIconType}\n                ref={ref}\n                role={role}\n                aria-live={ariaLive}\n                aria-atomic={ariaAtomic}\n                {...rest}\n            >\n                <Wrapper className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}>\n                    <ContentBox\n                        iconPlacement={IconPlacementInternal}\n                        className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n                    >\n                        {icon && (\n                            <IconWrapper\n                                iconPlacement={IconPlacementInternal}\n                                className={cx(classes.icon, getLayoutClass(layout))}\n                            >\n                                {icon}\n                            </IconWrapper>\n                        )}\n                        <TextBox\n                            iconPlacement={IconPlacementInternal}\n                            showCloseIcon={showCloseIcon}\n                            className={cx(classes.textbox, getLayoutClass(layout))}\n                        >\n                            {title && <StyledTitle className={classes.title}>{title}</StyledTitle>}\n                            {content && <StyledContent className={classes.text}>{content}</StyledContent>}\n                        </TextBox>\n                    </ContentBox>\n                    {actions && (\n                        <ButtonsWrapper\n                            iconPlacement={IconPlacementInternal}\n                            className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n                        >\n                            {actions}\n                        </ButtonsWrapper>\n                    )}\n\n                    {showCloseIcon && (\n                        <CloseIconWrapper\n                            view=\"clear\"\n                            size=\"s\"\n                            onClick={onCloseButtonClick}\n                            className={cx(classes.closeIcon, getLayoutClass(layout))}\n                        >\n                            {closeIconType === 'default' ? (\n                                <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            ) : (\n                                <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            )}\n                        </CloseIconWrapper>\n                    )}\n                </Wrapper>\n            </Root>\n        );\n    });\n\nexport const notificationConfig = {\n    name: 'Notification',\n    tag: 'div',\n    layout: notificationRoot,\n    base: StyledNotification,\n    variations: {\n        layout: {\n            css: layoutCSS,\n        },\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        closeIconType: {\n            css: closeIconTypeCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        layout: layouts.vertical,\n        size: 'xs',\n        closeIconType: 'default',\n    },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}

package/cjs/components/Notification/Notification.styles.js

@@ -1,4 +1,4 @@
-require('./Notification.styles_gk4bgs.css');
+require('./Notification.styles_1u5gusp.css');
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -41,19 +41,13 @@ var ButtonsWrapper = /*#__PURE__*/react.styled('div')({
 });
 var _exp21 = function _exp21() {
   return function (_ref2) {
-    var iconColor = _ref2.iconColor;
-    return iconColor || "var(".concat(Notification_tokens.tokens.contentLeftIconColor, ")");
+    var iconPlacement = _ref2.iconPlacement;
+    return iconPlacement === Notification_types.placements.left ? "var(".concat(Notification_tokens.tokens.contentLeftIconMargin, ")") : 'unset';
   };
 };
 var _exp22 = function _exp22() {
   return function (_ref3) {
     var iconPlacement = _ref3.iconPlacement;
-    return iconPlacement === Notification_types.placements.left ? "var(".concat(Notification_tokens.tokens.contentLeftIconMargin, ")") : 'unset';
-  };
-};
-var _exp23 = function _exp23() {
-  return function (_ref4) {
-    var iconPlacement = _ref4.iconPlacement;
     return iconPlacement === Notification_types.placements.top ? "var(".concat(Notification_tokens.tokens.contentTopIconMargin, ")") : 'unset';
   };
 };
@@ -63,19 +57,18 @@ var IconWrapper = /*#__PURE__*/react.styled('div')({
   propsAsIs: false,
   vars: {
     "i14raqr9-0": [/*#__PURE__*/_exp21()],
-    "i14raqr9-1": [/*#__PURE__*/_exp22()],
-    "i14raqr9-2": [/*#__PURE__*/_exp23()]
+    "i14raqr9-1": [/*#__PURE__*/_exp22()]
   }
 });
-var _exp26 = function _exp26() {
-  return function (_ref5) {
-    var iconPlacement = _ref5.iconPlacement;
+var _exp25 = function _exp25() {
+  return function (_ref4) {
+    var iconPlacement = _ref4.iconPlacement;
     return iconPlacement === Notification_types.placements.left ? 'flex' : 'block';
   };
 };
-var _exp27 = function _exp27() {
-  return function (_ref6) {
-    var iconPlacement = _ref6.iconPlacement;
+var _exp26 = function _exp26() {
+  return function (_ref5) {
+    var iconPlacement = _ref5.iconPlacement;
     return iconPlacement ? "var(".concat(Notification_tokens.tokens.contentPaddingTop, ")") : "var(".concat(Notification_tokens.tokens.contentPaddingTopWithoutIcon, ")");
   };
 };
@@ -84,20 +77,20 @@ var ContentBox = /*#__PURE__*/react.styled('div')({
   "class": "c157peez",
   propsAsIs: false,
   vars: {
-    "c157peez-0": [/*#__PURE__*/_exp26()],
-    "c157peez-1": [/*#__PURE__*/_exp27()]
+    "c157peez-0": [/*#__PURE__*/_exp25()],
+    "c157peez-1": [/*#__PURE__*/_exp26()]
   }
 });
-var _exp33 = function _exp33() {
-  return function (_ref7) {
-    var iconPlacement = _ref7.iconPlacement;
+var _exp32 = function _exp32() {
+  return function (_ref6) {
+    var iconPlacement = _ref6.iconPlacement;
     return !iconPlacement || iconPlacement === Notification_types.placements.top ? "var(".concat(Notification_tokens.tokens.textboxPaddingTopWithTopIcon, ")") : "var(".concat(Notification_tokens.tokens.textboxPaddingTop, ")");
   };
 };
-var _exp34 = function _exp34() {
-  return function (_ref8) {
-    var showCloseIcon = _ref8.showCloseIcon,
-      iconPlacement = _ref8.iconPlacement;
+var _exp33 = function _exp33() {
+  return function (_ref7) {
+    var showCloseIcon = _ref7.showCloseIcon,
+      iconPlacement = _ref7.iconPlacement;
     return showCloseIcon && iconPlacement !== Notification_types.placements.top ? "var(".concat(Notification_tokens.tokens.textboxPaddingRightWithCloseIcon, ")") : "var(".concat(Notification_tokens.tokens.textboxPaddingRight, ")");
   };
 };
@@ -106,23 +99,14 @@ var TextBox = /*#__PURE__*/react.styled('div')({
   "class": "t1vmb0f2",
   propsAsIs: false,
   vars: {
-    "t1vmb0f2-0": [/*#__PURE__*/_exp33()],
-    "t1vmb0f2-1": [/*#__PURE__*/_exp34()]
+    "t1vmb0f2-0": [/*#__PURE__*/_exp32()],
+    "t1vmb0f2-1": [/*#__PURE__*/_exp33()]
   }
 });
-var _exp44 = function _exp44() {
-  return function (_ref9) {
-    var textColor = _ref9.textColor;
-    return textColor || "var(".concat(Notification_tokens.tokens.titleColor, ")");
-  };
-};
 var StyledTitle = /*#__PURE__*/react.styled('div')({
   name: "StyledTitle",
   "class": "s1k4e58v",
-  propsAsIs: false,
-  vars: {
-    "s1k4e58v-0": [/*#__PURE__*/_exp44()]
-  }
+  propsAsIs: false
 });
 var StyledContent = /*#__PURE__*/react.styled('div')({
   name: "StyledContent",
@@ -134,9 +118,9 @@ var StyledItemWrapper = /*#__PURE__*/react.styled('div')({
   "class": "s18m0x6v",
   propsAsIs: false
 });
-var _exp57 = function _exp57() {
-  return function (_ref10) {
-    var placement = _ref10.placement;
+var _exp55 = function _exp55() {
+  return function (_ref8) {
+    var placement = _ref8.placement;
     return placement === 'bottom-left' ? 'flex-start' : 'flex-end';
   };
 };
@@ -145,7 +129,7 @@ var StyledRoot = /*#__PURE__*/react.styled('div')({
   "class": "sfe5ql2",
   propsAsIs: false,
   vars: {
-    "sfe5ql2-0": [/*#__PURE__*/_exp57()]
+    "sfe5ql2-0": [/*#__PURE__*/_exp55()]
   }
 });
 

package/cjs/components/Notification/Notification.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.styles.js","sources":["../../../src/components/Notification/Notification.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { applyHyphens } from '../../mixins';\nimport { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { CloseIconType, IconPlacementType, NotificationPlacement, placements } from './Notification.types';\n\nexport const StyledNotification = css`\n    width: fit-content;\n`;\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const CloseIconWrapper = styled(Button)`\n    position: absolute;\n    width: var(${tokens.closeIconButtonSize});\n    height: var(${tokens.closeIconButtonSize});\n    align-self: var(${tokens.horisontalIconCloseAlignSelf});\n\n    color: var(${tokens.closeIconColor});\n\n    :hover {\n        color: var(${tokens.closeIconColorOnHover});\n    }\n\n    &.${classes.horizontal} {\n        position: relative;\n    }\n`;\n\nexport const Wrapper = styled.div`\n    position: relative;\n    box-sizing: border-box;\n\n    background: var(${tokens.background});\n    border-radius: var(${tokens.borderRadius});\n    border: var(${tokens.borderWidth}) solid var(${tokens.borderColor});\n\n    &.${classes.horizontal} {\n        display: flex;\n        align-items: center;\n        gap: var(${tokens.horizontalLayoutGap});\n    }\n`;\n\nexport const ButtonsWrapper = styled.div<IconPlacementType>`\n    margin-top: var(${tokens.buttonsMarginTop});\n    margin-left: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.buttonsMarginLeft})` : 'unset'};\n\n    align-self: var(${tokens.horisontalActionsAlignSelf});\n\n    &.${classes.horizontal} {\n        margin-top: unset;\n        margin-left: unset;\n    }\n`;\n\nexport const IconWrapper = styled.div<IconPlacementType & { iconColor?: string }>`\n    width: var(${tokens.contentLeftIconSize});\n    height: var(${tokens.contentLeftIconSize});\n    align-self: var(${tokens.horisontalIconLeftAlignSelf});\n    color: ${({ iconColor }) => iconColor || `var(${tokens.contentLeftIconColor})`};\n\n    margin-right: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.contentLeftIconMargin})` : 'unset'};\n    margin-bottom: ${({ iconPlacement }) =>\n        iconPlacement === placements.top ? `var(${tokens.contentTopIconMargin})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-right: var(${tokens.horizontalLayoutLeftIconMargin});\n        margin-bottom: unset;\n    }\n`;\n\nexport const ContentBox = styled.div<IconPlacementType>`\n    // TODO: переделать, когда научимся работать с токенами при пересечнии свойств\n    // issue #909\n    display: ${({ iconPlacement }) => (iconPlacement === placements.left ? 'flex' : 'block')};\n\n    padding-top: ${({ iconPlacement }) =>\n        iconPlacement ? `var(${tokens.contentPaddingTop})` : `var(${tokens.contentPaddingTopWithoutIcon})`};\n\n    &.${classes.horizontal} {\n        padding: unset;\n        display: flex;\n        align-items: center;\n        flex-grow: 1;\n    }\n`;\n\nexport const TextBox = styled.div<CloseIconType & IconPlacementType>`\n    padding: var(${tokens.textboxPaddingTop}) var(${tokens.textboxPaddingRight}) var(${tokens.textboxPaddingBottom})\n        var(${tokens.textboxPaddingLeft});\n\n    padding-top: ${({ iconPlacement }) =>\n        !iconPlacement || iconPlacement === placements.top\n            ? `var(${tokens.textboxPaddingTopWithTopIcon})`\n            : `var(${tokens.textboxPaddingTop})`};\n    padding-right: ${({ showCloseIcon, iconPlacement }) =>\n        showCloseIcon && iconPlacement !== placements.top\n            ? `var(${tokens.textboxPaddingRightWithCloseIcon})`\n            : `var(${tokens.textboxPaddingRight})`};\n\n    display: flex;\n    flex-direction: column;\n    row-gap: var(${tokens.textboxGap});\n    word-break: break-word;\n\n    &.${classes.horizontal} {\n        padding: unset;\n    }\n`;\n\nexport const StyledTitle = styled.div<{ textColor?: string }>`\n    font-family: var(${tokens.titleFontFamily});\n    font-size: var(${tokens.titleFontSize});\n    font-style: var(${tokens.titleFontStyle});\n    font-weight: var(${tokens.titleFontWeight});\n    letter-spacing: var(${tokens.titleFontLetterSpacing});\n    line-height: var(${tokens.titleFontLineHeight});\n    ${String(applyHyphens)};\n\n    color: ${({ textColor }) => textColor || `var(${tokens.titleColor})`};\n`;\n\nexport const StyledContent = styled.div`\n    font-family: var(${tokens.contentFontFamily});\n    font-size: var(${tokens.contentFontSize});\n    font-style: var(${tokens.contentFontStyle});\n    font-weight: var(${tokens.contentFontWeight});\n    letter-spacing: var(${tokens.contentFontLetterSpacing});\n    line-height: var(${tokens.contentFontLineHeight});\n    ${String(applyHyphens)};\n\n    color: var(${tokens.contentColor});\n`;\n\nexport const StyledItemWrapper = styled.div<{ isHidden: boolean }>`\n    margin-top: 1rem;\n    opacity: 1;\n\n    &&.${classes.notificationItemOpened} {\n        animation: 0.4s showAnimation ease-out;\n\n        &.${classes.notificationLeftToRightAnimation} {\n            animation: 0.4s showLeftToRightAnimation ease-out;\n        }\n    }\n\n    &&.${classes.notificationItemHidden} {\n        animation: 0.4s hideAnimation ease-out;\n\n        &.${classes.notificationLeftToRightAnimation} {\n            animation: 0.4s hideLeftToRightAnimation ease-out;\n        }\n    }\n\n    @keyframes showLeftToRightAnimation {\n        0% {\n            transform: translateX(-100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideLeftToRightAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(-100%);\n            opacity: 0;\n        }\n    }\n\n    @keyframes showAnimation {\n        0% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n    }\n`;\n\nexport const StyledRoot = styled.div<{ placement?: NotificationPlacement }>`\n    display: flex;\n    flex-direction: column-reverse;\n    box-sizing: border-box;\n    padding: 0 1.5rem 1.5rem;\n    max-height: 100%;\n    align-items: ${({ placement }) => (placement === 'bottom-left' ? 'flex-start' : 'flex-end')};\n`;\n"],"names":["StyledNotification","mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp","CloseIconWrapper","styled","name","class","propsAsIs","Wrapper","_exp15","_ref","iconPlacement","placements","left","concat","tokens","buttonsMarginLeft","ButtonsWrapper","vars","_exp21","_ref2","iconColor","contentLeftIconColor","_exp22","_ref3","contentLeftIconMargin","_exp23","_ref4","top","contentTopIconMargin","IconWrapper","_exp26","_ref5","_exp27","_ref6","contentPaddingTop","contentPaddingTopWithoutIcon","ContentBox","_exp33","_ref7","textboxPaddingTopWithTopIcon","textboxPaddingTop","_exp34","_ref8","showCloseIcon","textboxPaddingRightWithCloseIcon","textboxPaddingRight","TextBox","_exp44","_ref9","textColor","titleColor","StyledTitle","StyledContent","StyledItemWrapper","_exp57","_ref10","placement","StyledRoot"],"mappings":"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"}
+{"version":3,"file":"Notification.styles.js","sources":["../../../src/components/Notification/Notification.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { applyHyphens } from '../../mixins';\nimport { buttonConfig } from '../Button';\nimport { component, mergeConfig } from '../../engines';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { CloseIconType, IconPlacementType, NotificationPlacement, placements } from './Notification.types';\n\nexport const StyledNotification = css`\n    width: fit-content;\n`;\n\nconst mergedButtonConfig = mergeConfig(buttonConfig);\nconst Button = component(mergedButtonConfig);\n\nexport const CloseIconWrapper = styled(Button)`\n    position: absolute;\n    width: var(${tokens.closeIconButtonSize});\n    height: var(${tokens.closeIconButtonSize});\n    align-self: var(${tokens.horisontalIconCloseAlignSelf});\n\n    color: var(${tokens.closeIconColor});\n\n    :hover {\n        color: var(${tokens.closeIconColorOnHover});\n    }\n\n    &.${classes.horizontal} {\n        position: relative;\n    }\n`;\n\nexport const Wrapper = styled.div`\n    position: relative;\n    box-sizing: border-box;\n\n    background: var(${tokens.background});\n    border-radius: var(${tokens.borderRadius});\n    border: var(${tokens.borderWidth}) solid var(${tokens.borderColor});\n\n    &.${classes.horizontal} {\n        display: flex;\n        align-items: center;\n        gap: var(${tokens.horizontalLayoutGap});\n    }\n`;\n\nexport const ButtonsWrapper = styled.div<IconPlacementType>`\n    margin-top: var(${tokens.buttonsMarginTop});\n    margin-left: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.buttonsMarginLeft})` : 'unset'};\n\n    align-self: var(${tokens.horisontalActionsAlignSelf});\n\n    &.${classes.horizontal} {\n        margin-top: unset;\n        margin-left: unset;\n    }\n`;\n\nexport const IconWrapper = styled.div<IconPlacementType>`\n    width: var(${tokens.contentLeftIconSize});\n    height: var(${tokens.contentLeftIconSize});\n    align-self: var(${tokens.horisontalIconLeftAlignSelf});\n\n    margin-right: ${({ iconPlacement }) =>\n        iconPlacement === placements.left ? `var(${tokens.contentLeftIconMargin})` : 'unset'};\n    margin-bottom: ${({ iconPlacement }) =>\n        iconPlacement === placements.top ? `var(${tokens.contentTopIconMargin})` : 'unset'};\n\n    &.${classes.horizontal} {\n        margin-right: var(${tokens.horizontalLayoutLeftIconMargin});\n        margin-bottom: unset;\n    }\n`;\n\nexport const ContentBox = styled.div<IconPlacementType>`\n    // TODO: переделать, когда научимся работать с токенами при пересечнии свойств\n    // issue #909\n    display: ${({ iconPlacement }) => (iconPlacement === placements.left ? 'flex' : 'block')};\n\n    padding-top: ${({ iconPlacement }) =>\n        iconPlacement ? `var(${tokens.contentPaddingTop})` : `var(${tokens.contentPaddingTopWithoutIcon})`};\n\n    &.${classes.horizontal} {\n        padding: unset;\n        display: flex;\n        align-items: center;\n        flex-grow: 1;\n    }\n`;\n\nexport const TextBox = styled.div<CloseIconType & IconPlacementType>`\n    padding: var(${tokens.textboxPaddingTop}) var(${tokens.textboxPaddingRight}) var(${tokens.textboxPaddingBottom})\n        var(${tokens.textboxPaddingLeft});\n\n    padding-top: ${({ iconPlacement }) =>\n        !iconPlacement || iconPlacement === placements.top\n            ? `var(${tokens.textboxPaddingTopWithTopIcon})`\n            : `var(${tokens.textboxPaddingTop})`};\n    padding-right: ${({ showCloseIcon, iconPlacement }) =>\n        showCloseIcon && iconPlacement !== placements.top\n            ? `var(${tokens.textboxPaddingRightWithCloseIcon})`\n            : `var(${tokens.textboxPaddingRight})`};\n\n    display: flex;\n    flex-direction: column;\n    row-gap: var(${tokens.textboxGap});\n    word-break: break-word;\n\n    &.${classes.horizontal} {\n        padding: unset;\n    }\n`;\n\nexport const StyledTitle = styled.div`\n    font-family: var(${tokens.titleFontFamily});\n    font-size: var(${tokens.titleFontSize});\n    font-style: var(${tokens.titleFontStyle});\n    font-weight: var(${tokens.titleFontWeight});\n    letter-spacing: var(${tokens.titleFontLetterSpacing});\n    line-height: var(${tokens.titleFontLineHeight});\n    ${String(applyHyphens)};\n`;\n\nexport const StyledContent = styled.div`\n    font-family: var(${tokens.contentFontFamily});\n    font-size: var(${tokens.contentFontSize});\n    font-style: var(${tokens.contentFontStyle});\n    font-weight: var(${tokens.contentFontWeight});\n    letter-spacing: var(${tokens.contentFontLetterSpacing});\n    line-height: var(${tokens.contentFontLineHeight});\n    ${String(applyHyphens)};\n\n    color: var(${tokens.contentColor});\n`;\n\nexport const StyledItemWrapper = styled.div<{ isHidden: boolean }>`\n    margin-top: 1rem;\n    opacity: 1;\n\n    &&.${classes.notificationItemOpened} {\n        animation: 0.4s showAnimation ease-out;\n\n        &.${classes.notificationLeftToRightAnimation} {\n            animation: 0.4s showLeftToRightAnimation ease-out;\n        }\n    }\n\n    &&.${classes.notificationItemHidden} {\n        animation: 0.4s hideAnimation ease-out;\n\n        &.${classes.notificationLeftToRightAnimation} {\n            animation: 0.4s hideLeftToRightAnimation ease-out;\n        }\n    }\n\n    @keyframes showLeftToRightAnimation {\n        0% {\n            transform: translateX(-100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideLeftToRightAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(-100%);\n            opacity: 0;\n        }\n    }\n\n    @keyframes showAnimation {\n        0% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n\n        100% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n    }\n\n    @keyframes hideAnimation {\n        0% {\n            transform: translateX(0);\n            opacity: 1;\n        }\n\n        100% {\n            transform: translateX(100%);\n            opacity: 0;\n        }\n    }\n`;\n\nexport const StyledRoot = styled.div<{ placement?: NotificationPlacement }>`\n    display: flex;\n    flex-direction: column-reverse;\n    box-sizing: border-box;\n    padding: 0 1.5rem 1.5rem;\n    max-height: 100%;\n    align-items: ${({ placement }) => (placement === 'bottom-left' ? 'flex-start' : 'flex-end')};\n`;\n"],"names":["StyledNotification","mergedButtonConfig","mergeConfig","buttonConfig","Button","component","_exp","CloseIconWrapper","styled","name","class","propsAsIs","Wrapper","_exp15","_ref","iconPlacement","placements","left","concat","tokens","buttonsMarginLeft","ButtonsWrapper","vars","_exp21","_ref2","contentLeftIconMargin","_exp22","_ref3","top","contentTopIconMargin","IconWrapper","_exp25","_ref4","_exp26","_ref5","contentPaddingTop","contentPaddingTopWithoutIcon","ContentBox","_exp32","_ref6","textboxPaddingTopWithTopIcon","textboxPaddingTop","_exp33","_ref7","showCloseIcon","textboxPaddingRightWithCloseIcon","textboxPaddingRight","TextBox","StyledTitle","StyledContent","StyledItemWrapper","_exp55","_ref8","placement","StyledRoot"],"mappings":"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"}

package/cjs/components/Notification/{Notification.styles_gk4bgs.css → Notification.styles_1u5gusp.css}

@@ -2,10 +2,10 @@
 .crvd7hm{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.crvd7hm:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.crvd7hm.notification-layout-horizontal{position:relative;}
 .wg1ga5v{position:relative;box-sizing:border-box;background:var(--plasma-notification-backgorund);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.wg1ga5v.notification-layout-horizontal{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
 .b1amsn8a{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.b1amsn8a.notification-layout-horizontal{margin-top:unset;margin-left:unset;}
-.i14raqr9{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.i14raqr9.notification-layout-horizontal{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
+.i14raqr9{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);margin-right:var(--i14raqr9-0);margin-bottom:var(--i14raqr9-1);}.i14raqr9.notification-layout-horizontal{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
 .c157peez{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.c157peez.notification-layout-horizontal{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
 .t1vmb0f2{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.t1vmb0f2.notification-layout-horizontal{padding:unset;}
-.s1k4e58v{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
+.s1k4e58v{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
 .s92kmpm{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);}
 .s18m0x6v{margin-top:1rem;opacity:1;}.s18m0x6v.s18m0x6v.notification-item-opened{-webkit-animation:0.4s showAnimation-s18m0x6v ease-out;animation:0.4s showAnimation-s18m0x6v ease-out;}.s18m0x6v.s18m0x6v.notification-item-opened.notification-left-to-right-animation{-webkit-animation:0.4s showLeftToRightAnimation-s18m0x6v ease-out;animation:0.4s showLeftToRightAnimation-s18m0x6v ease-out;}.s18m0x6v.s18m0x6v.notification-item-hidden{-webkit-animation:0.4s hideAnimation-s18m0x6v ease-out;animation:0.4s hideAnimation-s18m0x6v ease-out;}.s18m0x6v.s18m0x6v.notification-item-hidden.notification-left-to-right-animation{-webkit-animation:0.4s hideLeftToRightAnimation-s18m0x6v ease-out;animation:0.4s hideLeftToRightAnimation-s18m0x6v ease-out;}@-webkit-keyframes showLeftToRightAnimation-s18m0x6v{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 showLeftToRightAnimation-s18m0x6v{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 hideLeftToRightAnimation-s18m0x6v{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 hideLeftToRightAnimation-s18m0x6v{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;}}@-webkit-keyframes showAnimation-s18m0x6v{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 showAnimation-s18m0x6v{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 hideAnimation-s18m0x6v{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 hideAnimation-s18m0x6v{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;}}
 .sfe5ql2{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:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}

package/cjs/components/Notification/Notification.tokens.js

@@ -49,7 +49,6 @@ var tokens = {
   textboxGap: '--plasma-notification-textbox-gap',
   buttonsMarginTop: '--plasma-notification-buttons-margin-top',
   buttonsMarginLeft: '--plasma-notification-buttons-margin-left',
-  contentLeftIconColor: '--plasma-notification-content-left-icon-color',
   contentLeftIconSize: '--plasma-notification-content-left-icon-size',
   contentLeftIconMargin: '--plasma-notification-content-left-icon-margin',
   contentTopIconMargin: '--plasma-notification-content-top-icon-margin',

package/cjs/components/Notification/Notification.tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.tokens.js","sources":["../../../src/components/Notification/Notification.tokens.ts"],"sourcesContent":["export const classes = {\n    textbox: 'notificaiton-textbox',\n    contentBox: 'notificaiton-content-box',\n    title: 'notification-title',\n    text: 'notification-text',\n    wrapper: 'notification-wrapper',\n    icon: 'notification-icon',\n    closeIcon: 'notification-close-icon',\n    buttonsWrapper: 'notification-buttons-wrapper',\n\n    horizontal: 'notification-layout-horizontal',\n    vertical: 'notification-layout-vertical',\n    oneLine: 'notification-one-line-textbox',\n    withoutIcon: 'notification-without-icon',\n    withoutCloseIcon: 'notification-without-close-icon',\n\n    notificationItemOpened: 'notification-item-opened',\n    notificationItemHidden: 'notification-item-hidden',\n    notificationLeftToRightAnimation: 'notification-left-to-right-animation',\n};\n\nexport const tokens = {\n    background: '--plasma-notification-backgorund',\n    padding: '--plasma-notification-padding',\n    horizontalLayoutPadding: '--plasma-notification-horizontal-layout-padding',\n    width: '--plasma-notification-width',\n    borderRadius: '--plasma-notification-border-radius',\n    borderWidth: '--plasma-notification-border-width',\n    borderColor: '--plasma-notification-border-color',\n\n    paddingOneLineTextbox: '--plasma-notification-padding-one-line-textbox',\n    horizontalLayoutGap: '--plasma-notification-horizontal-layout-gap',\n    horizontalLayoutLeftIconMargin: '--plasma-notification-horizontal-layout-left-icon-margin',\n    horizontalLayoutRightPaddingWithoutCloseIcon:\n        '--plasma-notification-horizontal-layout-right-padding-without-close-icon',\n    horisontalIconLeftAlignSelf: '--plasma-notification-horizontal-icon-left-align-self',\n    horisontalActionsAlignSelf: '--plasma-notification-horizontal-actions-align-self',\n    horisontalIconCloseAlignSelf: '--plasma-notification-horizontal-icon-close-align-self',\n\n    contentPaddingTop: '--plasma-notification-content-padding-top',\n    contentPaddingRight: '--plasma-notification-content-padding-right',\n    contentPaddingBottom: '--plasma-notification-content-padding-bottom',\n    contentPaddingLeft: '--plasma-notification-content-padding-left',\n\n    contentPaddingTopWithoutIcon: '--plasma-notification-content-padding-top-without-icon',\n\n    textboxPaddingTop: '--plasma-notification-textbox-padding-top',\n    textboxPaddingRight: '--plasma-notification-textbox-padding-right',\n    textboxPaddingBottom: '--plasma-notification-textbox-padding-bottom',\n    textboxPaddingLeft: '--plasma-notification-textbox-padding-left',\n\n    textboxPaddingTopWithTopIcon: '--plasma-notification-textbox-padding-top-with-top-icon',\n    textboxPaddingRightWithCloseIcon: '--plasma-notification-textbox-padding-right-with-close-icon',\n    textboxGap: '--plasma-notification-textbox-gap',\n\n    buttonsMarginTop: '--plasma-notification-buttons-margin-top',\n    buttonsMarginLeft: '--plasma-notification-buttons-margin-left',\n\n    contentLeftIconColor: '--plasma-notification-content-left-icon-color',\n    contentLeftIconSize: '--plasma-notification-content-left-icon-size',\n    contentLeftIconMargin: '--plasma-notification-content-left-icon-margin',\n    contentTopIconMargin: '--plasma-notification-content-top-icon-margin',\n\n    contentColor: '--plasma-notification-content-color',\n    contentFontFamily: '--plasma-notification-content-font-family',\n    contentFontSize: '--plasma-notification-content-font-size',\n    contentFontStyle: '--plasma-notification-content-font-style',\n    contentFontWeight: '--plasma-notification-content-font-weight',\n    contentFontWeightBold: '--plasma-notification-content-font-weight-bold',\n    contentFontLetterSpacing: '--plasma-notification-content-font-letter-spacing',\n    contentFontLineHeight: '--plasma-notification-content-font-line-height',\n\n    titleColor: '--plasma-notification-title-color',\n    titleFontFamily: '--plasma-notification-title-font-family',\n    titleFontSize: '--plasma-notification-title-font-size',\n    titleFontStyle: '--plasma-notification-title-font-style',\n    titleFontWeight: '--plasma-notification-title-font-weight',\n    titleFontWeightBold: '--plasma-notification-title-font-weight-bold',\n    titleFontLetterSpacing: '--plasma-notification-title-font-letter-spacing',\n    titleFontLineHeight: '--plasma-notification-title-font-line-height',\n\n    closeIconTop: '--plasma-notification-close-icon-top',\n    closeIconRight: '--plasma-notification-close-icon-right',\n    closeIconColor: '--plasma-notification-close-icon-color',\n    closeIconColorOnHover: '--plasma-notification-close-icon-color-on-hover',\n    closeIconSize: '--plasma-notification-close-icon-size',\n    closeIconButtonSize: '--plasma-notification-close-icon-button-size',\n};\n"],"names":["classes","textbox","contentBox","title","text","wrapper","icon","closeIcon","buttonsWrapper","horizontal","vertical","oneLine","withoutIcon","withoutCloseIcon","notificationItemOpened","notificationItemHidden","notificationLeftToRightAnimation","tokens","background","padding","horizontalLayoutPadding","width","borderRadius","borderWidth","borderColor","paddingOneLineTextbox","horizontalLayoutGap","horizontalLayoutLeftIconMargin","horizontalLayoutRightPaddingWithoutCloseIcon","horisontalIconLeftAlignSelf","horisontalActionsAlignSelf","horisontalIconCloseAlignSelf","contentPaddingTop","contentPaddingRight","contentPaddingBottom","contentPaddingLeft","contentPaddingTopWithoutIcon","textboxPaddingTop","textboxPaddingRight","textboxPaddingBottom","textboxPaddingLeft","textboxPaddingTopWithTopIcon","textboxPaddingRightWithCloseIcon","textboxGap","buttonsMarginTop","buttonsMarginLeft","contentLeftIconColor","contentLeftIconSize","contentLeftIconMargin","contentTopIconMargin","contentColor","contentFontFamily","contentFontSize","contentFontStyle","contentFontWeight","contentFontWeightBold","contentFontLetterSpacing","contentFontLineHeight","titleColor","titleFontFamily","titleFontSize","titleFontStyle","titleFontWeight","titleFontWeightBold","titleFontLetterSpacing","titleFontLineHeight","closeIconTop","closeIconRight","closeIconColor","closeIconColorOnHover","closeIconSize","closeIconButtonSize"],"mappings":"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"}
+{"version":3,"file":"Notification.tokens.js","sources":["../../../src/components/Notification/Notification.tokens.ts"],"sourcesContent":["export const classes = {\n    textbox: 'notificaiton-textbox',\n    contentBox: 'notificaiton-content-box',\n    title: 'notification-title',\n    text: 'notification-text',\n    wrapper: 'notification-wrapper',\n    icon: 'notification-icon',\n    closeIcon: 'notification-close-icon',\n    buttonsWrapper: 'notification-buttons-wrapper',\n\n    horizontal: 'notification-layout-horizontal',\n    vertical: 'notification-layout-vertical',\n    oneLine: 'notification-one-line-textbox',\n    withoutIcon: 'notification-without-icon',\n    withoutCloseIcon: 'notification-without-close-icon',\n\n    notificationItemOpened: 'notification-item-opened',\n    notificationItemHidden: 'notification-item-hidden',\n    notificationLeftToRightAnimation: 'notification-left-to-right-animation',\n};\n\nexport const tokens = {\n    background: '--plasma-notification-backgorund',\n    padding: '--plasma-notification-padding',\n    horizontalLayoutPadding: '--plasma-notification-horizontal-layout-padding',\n    width: '--plasma-notification-width',\n    borderRadius: '--plasma-notification-border-radius',\n    borderWidth: '--plasma-notification-border-width',\n    borderColor: '--plasma-notification-border-color',\n\n    paddingOneLineTextbox: '--plasma-notification-padding-one-line-textbox',\n    horizontalLayoutGap: '--plasma-notification-horizontal-layout-gap',\n    horizontalLayoutLeftIconMargin: '--plasma-notification-horizontal-layout-left-icon-margin',\n    horizontalLayoutRightPaddingWithoutCloseIcon:\n        '--plasma-notification-horizontal-layout-right-padding-without-close-icon',\n    horisontalIconLeftAlignSelf: '--plasma-notification-horizontal-icon-left-align-self',\n    horisontalActionsAlignSelf: '--plasma-notification-horizontal-actions-align-self',\n    horisontalIconCloseAlignSelf: '--plasma-notification-horizontal-icon-close-align-self',\n\n    contentPaddingTop: '--plasma-notification-content-padding-top',\n    contentPaddingRight: '--plasma-notification-content-padding-right',\n    contentPaddingBottom: '--plasma-notification-content-padding-bottom',\n    contentPaddingLeft: '--plasma-notification-content-padding-left',\n\n    contentPaddingTopWithoutIcon: '--plasma-notification-content-padding-top-without-icon',\n\n    textboxPaddingTop: '--plasma-notification-textbox-padding-top',\n    textboxPaddingRight: '--plasma-notification-textbox-padding-right',\n    textboxPaddingBottom: '--plasma-notification-textbox-padding-bottom',\n    textboxPaddingLeft: '--plasma-notification-textbox-padding-left',\n\n    textboxPaddingTopWithTopIcon: '--plasma-notification-textbox-padding-top-with-top-icon',\n    textboxPaddingRightWithCloseIcon: '--plasma-notification-textbox-padding-right-with-close-icon',\n    textboxGap: '--plasma-notification-textbox-gap',\n\n    buttonsMarginTop: '--plasma-notification-buttons-margin-top',\n    buttonsMarginLeft: '--plasma-notification-buttons-margin-left',\n\n    contentLeftIconSize: '--plasma-notification-content-left-icon-size',\n    contentLeftIconMargin: '--plasma-notification-content-left-icon-margin',\n    contentTopIconMargin: '--plasma-notification-content-top-icon-margin',\n\n    contentColor: '--plasma-notification-content-color',\n    contentFontFamily: '--plasma-notification-content-font-family',\n    contentFontSize: '--plasma-notification-content-font-size',\n    contentFontStyle: '--plasma-notification-content-font-style',\n    contentFontWeight: '--plasma-notification-content-font-weight',\n    contentFontWeightBold: '--plasma-notification-content-font-weight-bold',\n    contentFontLetterSpacing: '--plasma-notification-content-font-letter-spacing',\n    contentFontLineHeight: '--plasma-notification-content-font-line-height',\n\n    titleColor: '--plasma-notification-title-color',\n    titleFontFamily: '--plasma-notification-title-font-family',\n    titleFontSize: '--plasma-notification-title-font-size',\n    titleFontStyle: '--plasma-notification-title-font-style',\n    titleFontWeight: '--plasma-notification-title-font-weight',\n    titleFontWeightBold: '--plasma-notification-title-font-weight-bold',\n    titleFontLetterSpacing: '--plasma-notification-title-font-letter-spacing',\n    titleFontLineHeight: '--plasma-notification-title-font-line-height',\n\n    closeIconTop: '--plasma-notification-close-icon-top',\n    closeIconRight: '--plasma-notification-close-icon-right',\n    closeIconColor: '--plasma-notification-close-icon-color',\n    closeIconColorOnHover: '--plasma-notification-close-icon-color-on-hover',\n    closeIconSize: '--plasma-notification-close-icon-size',\n    closeIconButtonSize: '--plasma-notification-close-icon-button-size',\n};\n"],"names":["classes","textbox","contentBox","title","text","wrapper","icon","closeIcon","buttonsWrapper","horizontal","vertical","oneLine","withoutIcon","withoutCloseIcon","notificationItemOpened","notificationItemHidden","notificationLeftToRightAnimation","tokens","background","padding","horizontalLayoutPadding","width","borderRadius","borderWidth","borderColor","paddingOneLineTextbox","horizontalLayoutGap","horizontalLayoutLeftIconMargin","horizontalLayoutRightPaddingWithoutCloseIcon","horisontalIconLeftAlignSelf","horisontalActionsAlignSelf","horisontalIconCloseAlignSelf","contentPaddingTop","contentPaddingRight","contentPaddingBottom","contentPaddingLeft","contentPaddingTopWithoutIcon","textboxPaddingTop","textboxPaddingRight","textboxPaddingBottom","textboxPaddingLeft","textboxPaddingTopWithTopIcon","textboxPaddingRightWithCloseIcon","textboxGap","buttonsMarginTop","buttonsMarginLeft","contentLeftIconSize","contentLeftIconMargin","contentTopIconMargin","contentColor","contentFontFamily","contentFontSize","contentFontStyle","contentFontWeight","contentFontWeightBold","contentFontLetterSpacing","contentFontLineHeight","titleColor","titleFontFamily","titleFontSize","titleFontStyle","titleFontWeight","titleFontWeightBold","titleFontLetterSpacing","titleFontLineHeight","closeIconTop","closeIconRight","closeIconColor","closeIconColorOnHover","closeIconSize","closeIconButtonSize"],"mappings":"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"}

package/cjs/components/Notification/Notification.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.types.js","sources":["../../../src/components/Notification/Notification.types.ts"],"sourcesContent":["import type { AsProps } from '@salutejs/plasma-core';\nimport { HTMLAttributes, ReactNode } from 'react';\n\nimport { ComponentConfig, PropsType, Variants } from '../../engines/types';\n\nexport const layouts = {\n    horizontal: 'horizontal',\n    vertical: 'vertical',\n};\n\nexport type NotificationLayout = keyof typeof layouts;\n\nexport const placements = {\n    top: 'top',\n    left: 'left',\n};\n\nexport type NotificationIconPlacement = keyof typeof placements;\nexport type NotificationPlacement = 'bottom-right' | 'bottom-left';\n\nexport type LayoutType = {\n    layout?: NotificationLayout;\n};\n\nexport type IconPlacementType = {\n    iconPlacement?: NotificationIconPlacement;\n};\n\nexport type CloseIconType = {\n    showCloseIcon?: boolean;\n};\n\nexport interface NotificationProps extends AsProps, Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n    /**\n     * Заголовок.\n     */\n    title?: ReactNode;\n    /**\n     * Контент под заголовком.\n     */\n    children?: ReactNode;\n    /**\n     *  Кнопки снизу/справа для необходимых действий.\n     */\n    actions?: ReactNode;\n    /**\n     * Cхема расположение блоков Notification.\n     */\n    layout?: NotificationLayout;\n    /**\n     * Иконка слева.\n     */\n    icon?: ReactNode;\n    /**\n     * Расположение иконки слева внутри Textbox.\n     */\n    iconPlacement?: NotificationIconPlacement;\n    /**\n     * Показывать ли иконку закрытия справа.\n     * @default\n     * true\n     */\n    showCloseIcon?: boolean;\n    /**\n     * Колбек при нажатии на кнопку закрытия.\n     */\n    onCloseButtonClick?: () => void;\n    /**\n     * @deprecated\n     * Не влияет на отображение компонента.\n     * Статус компонента Notification.\n     */\n    status?: string;\n\n    /**\n     * Вид Notification.\n     */\n    view?: string;\n    /**\n     * Размер Notification (необходимо связать с размером используемых Button).\n     */\n    size?: string;\n    /**\n     * Вид закрывающей иконки в Notification.\n     */\n    closeIconType?: 'default' | 'thin';\n    /**\n     * @description Только для применения в рамках SSR.\n     */\n    UNSAFE_SSR_ENABLED?: boolean;\n    /**\n     * Цвет текста (по умолчанию берётся цвет из view)\n     */\n    textColor?: string;\n    /**\n     * Цвет иконки (по умолчанию берётся цвет из view)\n     */\n    iconColor?: string;\n}\n\nexport interface NotificationPortalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n    /**\n     * Конфиг компонента Notification.\n     */\n    config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & HTMLAttributes<HTMLDivElement>>;\n    /**\n     * В каком контейнере позиционируется(по умолчанию document), можно также указать id элемента или ref для него.\n     */\n    frame?: string;\n    /**\n     * Расположение компонента Notification во frame\n     * @default bottom-right\n     */\n    placement?: NotificationPlacement;\n    /**\n     * @description Только для применения в рамках SSR.\n     */\n    UNSAFE_SSR_ENABLED?: boolean;\n}\n"],"names":["layouts","horizontal","vertical","placements","top","left"],"mappings":";;;;AAKO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,QAAQ,EAAE,UAAA;AACd,EAAC;AAIM,IAAMC,UAAU,GAAG;AACtBC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,IAAI,EAAE,MAAA;AACV;;;;;"}
+{"version":3,"file":"Notification.types.js","sources":["../../../src/components/Notification/Notification.types.ts"],"sourcesContent":["import type { AsProps } from '@salutejs/plasma-core';\nimport { HTMLAttributes, ReactNode } from 'react';\n\nimport { ComponentConfig, PropsType, Variants } from '../../engines/types';\n\nexport const layouts = {\n    horizontal: 'horizontal',\n    vertical: 'vertical',\n};\n\nexport type NotificationLayout = keyof typeof layouts;\n\nexport const placements = {\n    top: 'top',\n    left: 'left',\n};\n\nexport type NotificationIconPlacement = keyof typeof placements;\nexport type NotificationPlacement = 'bottom-right' | 'bottom-left';\n\nexport type LayoutType = {\n    layout?: NotificationLayout;\n};\n\nexport type IconPlacementType = {\n    iconPlacement?: NotificationIconPlacement;\n};\n\nexport type CloseIconType = {\n    showCloseIcon?: boolean;\n};\n\nexport interface NotificationProps extends AsProps, Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n    /**\n     * Заголовок.\n     */\n    title?: ReactNode;\n    /**\n     * Контент под заголовком.\n     */\n    children?: ReactNode;\n    /**\n     *  Кнопки снизу/справа для необходимых действий.\n     */\n    actions?: ReactNode;\n    /**\n     * Cхема расположение блоков Notification.\n     */\n    layout?: NotificationLayout;\n    /**\n     * Иконка слева.\n     */\n    icon?: ReactNode;\n    /**\n     * Расположение иконки слева внутри Textbox.\n     */\n    iconPlacement?: NotificationIconPlacement;\n    /**\n     * Показывать ли иконку закрытия справа.\n     * @default\n     * true\n     */\n    showCloseIcon?: boolean;\n    /**\n     * Колбек при нажатии на кнопку закрытия.\n     */\n    onCloseButtonClick?: () => void;\n    /**\n     * @deprecated\n     * Не влияет на отображение компонента.\n     * Статус компонента Notification.\n     */\n    status?: string;\n\n    /**\n     * Вид Notification.\n     */\n    view?: string;\n    /**\n     * Размер Notification (необходимо связать с размером используемых Button).\n     */\n    size?: string;\n    /**\n     * Вид закрывающей иконки в Notification.\n     */\n    closeIconType?: 'default' | 'thin';\n    /**\n     * @description Только для применения в рамках SSR.\n     */\n    UNSAFE_SSR_ENABLED?: boolean;\n}\n\nexport interface NotificationPortalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n    /**\n     * Конфиг компонента Notification.\n     */\n    config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & HTMLAttributes<HTMLDivElement>>;\n    /**\n     * В каком контейнере позиционируется(по умолчанию document), можно также указать id элемента или ref для него.\n     */\n    frame?: string;\n    /**\n     * Расположение компонента Notification во frame\n     * @default bottom-right\n     */\n    placement?: NotificationPlacement;\n    /**\n     * @description Только для применения в рамках SSR.\n     */\n    UNSAFE_SSR_ENABLED?: boolean;\n}\n"],"names":["layouts","horizontal","vertical","placements","top","left"],"mappings":";;;;AAKO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,QAAQ,EAAE,UAAA;AACd,EAAC;AAIM,IAAMC,UAAU,GAAG;AACtBC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,IAAI,EAAE,MAAA;AACV;;;;;"}

package/cjs/components/Notification/NotificationsPortal.js

@@ -46,7 +46,6 @@ var NotificationsPortal = function NotificationsPortal(_ref) {
   var Notification = React.useMemo(function () {
     return common.component(config);
   }, []);
-  console.log(notifications);
   return /*#__PURE__*/React__default.default.createElement(PopupContext.PopupProvider, {
     UNSAFE_SSR_ENABLED: UNSAFE_SSR_ENABLED
   }, notifications.length > 0 && /*#__PURE__*/React__default.default.createElement(StyledPopup, {

package/cjs/components/Notification/NotificationsPortal.js.map

@@ -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';\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> = ({\n    config,\n    frame,\n    placement = 'bottom-right',\n    UNSAFE_SSR_ENABLED,\n}) => {\n    const { notifications } = useStoreon<NotificationsState, NotificationsEvents>('notifications');\n\n    const Notification = useMemo(\n        () => component(config) as ForwardRefExoticComponent<NotificationProps & RefAttributes<HTMLDivElement>>,\n        [],\n    );\n\n    console.log(notifications);\n\n    return (\n        <PopupProvider UNSAFE_SSR_ENABLED={UNSAFE_SSR_ENABLED}>\n            {notifications.length > 0 && (\n                <StyledPopup opened frame={frame} placement={placement} zIndex=\"9100\">\n                    <StyledRoot placement={placement}>\n                        {notifications.map(({ id, isHidden, ...rest }) => (\n                            <StyledItemWrapper\n                                key={id}\n                                className={cx(\n                                    isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n                                    placement === 'bottom-left' && classes.notificationLeftToRightAnimation,\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","_ref$placement","placement","UNSAFE_SSR_ENABLED","_useStoreon","useStoreon","notifications","Notification","useMemo","console","log","React","createElement","PopupProvider","length","opened","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","notificationLeftToRightAnimation","_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,EAKvD;AAAA,EAAA,IAJFC,MAAM,GAAAD,IAAA,CAANC,MAAM;IACNC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAAC,cAAA,GAAAH,IAAA,CACLI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,cAAc,GAAAA,cAAA;IAC1BE,kBAAAA,GAAAA,IAAAA,CAAAA,kBAAAA,CAAAA;AAEA,EAAA,IAAAC,WAAA,GAA0BC,gBAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,aAAO,CACxB,YAAA;IAAA,OAAMnB,gBAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAEDU,EAAAA,OAAO,CAACC,GAAG,CAACJ,aAAa,CAAC,CAAA;AAE1B,EAAA,oBACIK,sBAAA,CAAAC,aAAA,CAACC,0BAAa,EAAA;AAACV,IAAAA,kBAAkB,EAAEA,kBAAAA;GAC9BG,EAAAA,aAAa,CAACQ,MAAM,GAAG,CAAC,iBACrBH,sBAAA,CAAAC,aAAA,CAACpB,WAAW,EAAA;IAACuB,MAAM,EAAA,IAAA;AAACf,IAAAA,KAAK,EAAEA,KAAM;AAACE,IAAAA,SAAS,EAAEA,SAAU;AAACc,IAAAA,MAAM,EAAC,MAAA;AAAM,GAAA,eACjEL,sBAAA,CAAAC,aAAA,CAACK,8BAAU,EAAA;AAACf,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,EAC5BI,aAAa,CAACY,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,oBACnCX,sBAAA,CAAAC,aAAA,CAACW,qCAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;MACRK,SAAS,EAAEC,QAAE,CACTL,QAAQ,GAAGM,2BAAO,CAACC,sBAAsB,GAAGD,2BAAO,CAACE,sBAAsB,EAC1E3B,SAAS,KAAK,aAAa,IAAIyB,2BAAO,CAACG,gCAC3C,CAAE;MACFT,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BV,sBAAA,CAAAC,aAAA,CAACL,YAAY,EAAAwB,iCAAA,CAAA;AACTP,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPY,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,oCAAiB,CAACb,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}
+{"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> = ({\n    config,\n    frame,\n    placement = 'bottom-right',\n    UNSAFE_SSR_ENABLED,\n}) => {\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 UNSAFE_SSR_ENABLED={UNSAFE_SSR_ENABLED}>\n            {notifications.length > 0 && (\n                <StyledPopup opened frame={frame} placement={placement} zIndex=\"9100\">\n                    <StyledRoot placement={placement}>\n                        {notifications.map(({ id, isHidden, ...rest }) => (\n                            <StyledItemWrapper\n                                key={id}\n                                className={cx(\n                                    isHidden ? classes.notificationItemHidden : classes.notificationItemOpened,\n                                    placement === 'bottom-left' && classes.notificationLeftToRightAnimation,\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","_ref$placement","placement","UNSAFE_SSR_ENABLED","_useStoreon","useStoreon","notifications","Notification","useMemo","React","createElement","PopupProvider","length","opened","zIndex","StyledRoot","map","_ref2","id","isHidden","rest","StyledItemWrapper","key","className","cx","classes","notificationItemHidden","notificationItemOpened","notificationLeftToRightAnimation","_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,EAKvD;AAAA,EAAA,IAJFC,MAAM,GAAAD,IAAA,CAANC,MAAM;IACNC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAAC,cAAA,GAAAH,IAAA,CACLI,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,cAAc,GAAAA,cAAA;IAC1BE,kBAAAA,GAAAA,IAAAA,CAAAA,kBAAAA,CAAAA;AAEA,EAAA,IAAAC,WAAA,GAA0BC,gBAAU,CAA0C,eAAe,CAAC;IAAtFC,aAAAA,GAAAA,WAAAA,CAAAA,aAAAA,CAAAA;EAER,IAAMC,YAAY,GAAGC,aAAO,CACxB,YAAA;IAAA,OAAMnB,gBAAS,CAACU,MAAM,CAAC,CAAA;GACvB,EAAA,EACJ,CAAC,CAAA;AAED,EAAA,oBACIU,sBAAA,CAAAC,aAAA,CAACC,0BAAa,EAAA;AAACR,IAAAA,kBAAkB,EAAEA,kBAAAA;GAC9BG,EAAAA,aAAa,CAACM,MAAM,GAAG,CAAC,iBACrBH,sBAAA,CAAAC,aAAA,CAAClB,WAAW,EAAA;IAACqB,MAAM,EAAA,IAAA;AAACb,IAAAA,KAAK,EAAEA,KAAM;AAACE,IAAAA,SAAS,EAAEA,SAAU;AAACY,IAAAA,MAAM,EAAC,MAAA;AAAM,GAAA,eACjEL,sBAAA,CAAAC,aAAA,CAACK,8BAAU,EAAA;AAACb,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,EAC5BI,aAAa,CAACU,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,oBACnCX,sBAAA,CAAAC,aAAA,CAACW,qCAAiB,EAAA;AACdC,MAAAA,GAAG,EAAEJ,EAAG;MACRK,SAAS,EAAEC,QAAE,CACTL,QAAQ,GAAGM,2BAAO,CAACC,sBAAsB,GAAGD,2BAAO,CAACE,sBAAsB,EAC1EzB,SAAS,KAAK,aAAa,IAAIuB,2BAAO,CAACG,gCAC3C,CAAE;MACFT,QAAQ,EAAEA,QAAQ,IAAI,KAAA;AAAM,KAAA,eAE5BV,sBAAA,CAAAC,aAAA,CAACH,YAAY,EAAAsB,iCAAA,CAAA;AACTP,MAAAA,GAAG,EAAEJ,EAAG;AACRA,MAAAA,EAAE,EAAEA,EAAG;MACPY,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;QAAA,OAAMC,oCAAiB,CAACb,EAAE,CAAC,CAAA;AAAA,OAAA;KAC3CE,EAAAA,IAAI,CAAC,CAEE,CACtB,CAAA;GACO,CAAA,CACH,CAEN,CAAC,CAAA;AAExB;;;;"}

package/cjs/components/Notification/NotificationsProvider.css

@@ -29,16 +29,16 @@
 .Button_styles_8cvmld_s1rjh7ra__4694a0fa{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-self:var(--plasma-button-right-content-align-self);-ms-flex-item-align:var(--plasma-button-right-content-align);align-self:var(--plasma-button-right-content-align-self);margin:var(--s1rjh7ra-0);}
 .Button_styles_8cvmld_b9ga1dj__4694a0fa{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma_private-btn-br:var(--plasma_computed-btn-br);border-radius:var(--plasma_private-btn-br);}a.Button_styles_8cvmld_b9ga1dj__4694a0fa{-webkit-text-decoration:none;text-decoration:none;}.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_buttonSquare__4694a0fa{width:var(--plasma-button-height);padding:0;}
 
-.Notification_styles_gk4bgs_sb12p__85070c43{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
-.Notification_styles_gk4bgs_crvd7hm__85070c43{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_gk4bgs_crvd7hm__85070c43:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_gk4bgs_crvd7hm__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{position:relative;}
-.Notification_styles_gk4bgs_wg1ga5v__85070c43{position:relative;box-sizing:border-box;background:var(--plasma-notification-backgorund);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.Notification_styles_gk4bgs_wg1ga5v__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
-.Notification_styles_gk4bgs_b1amsn8a__85070c43{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_gk4bgs_b1amsn8a__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{margin-top:unset;margin-left:unset;}
-.Notification_styles_gk4bgs_i14raqr9__85070c43{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.Notification_styles_gk4bgs_i14raqr9__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
-.Notification_styles_gk4bgs_c157peez__85070c43{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_gk4bgs_c157peez__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
-.Notification_styles_gk4bgs_t1vmb0f2__85070c43{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_gk4bgs_t1vmb0f2__85070c43.Notification_styles_gk4bgs_notificationLayoutHorizontal__85070c43{padding:unset;}
-.Notification_styles_gk4bgs_s1k4e58v__85070c43{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
-.Notification_styles_gk4bgs_s92kmpm__85070c43{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);}
-.Notification_styles_gk4bgs_s18m0x6v__85070c43{margin-top:1rem;opacity:1;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemOpened__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemOpened__85070c43.Notification_styles_gk4bgs_notificationLeftToRightAnimation__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemHidden__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_hideAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_hideAnimationS18m0x6v__85070c43 ease-out;}.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_s18m0x6v__85070c43.Notification_styles_gk4bgs_notificationItemHidden__85070c43.Notification_styles_gk4bgs_notificationLeftToRightAnimation__85070c43{-webkit-animation:0.4s Notification_styles_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43 ease-out;animation:0.4s Notification_styles_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43 ease-out;}@-webkit-keyframes Notification_styles_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_showLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43{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_gk4bgs_hideLeftToRightAnimationS18m0x6v__85070c43{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;}}@-webkit-keyframes Notification_styles_gk4bgs_showAnimationS18m0x6v__85070c43{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_gk4bgs_showAnimationS18m0x6v__85070c43{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_gk4bgs_hideAnimationS18m0x6v__85070c43{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_gk4bgs_hideAnimationS18m0x6v__85070c43{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;}}
-.Notification_styles_gk4bgs_sfe5ql2__85070c43{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:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}
+.Notification_styles_1u5gusp_sb12p__dcdf3719{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
+.Notification_styles_1u5gusp_crvd7hm__dcdf3719{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_1u5gusp_crvd7hm__dcdf3719:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_1u5gusp_crvd7hm__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{position:relative;}
+.Notification_styles_1u5gusp_wg1ga5v__dcdf3719{position:relative;box-sizing:border-box;background:var(--plasma-notification-backgorund);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.Notification_styles_1u5gusp_wg1ga5v__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
+.Notification_styles_1u5gusp_b1amsn8a__dcdf3719{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_1u5gusp_b1amsn8a__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{margin-top:unset;margin-left:unset;}
+.Notification_styles_1u5gusp_i14raqr9__dcdf3719{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);margin-right:var(--i14raqr9-0);margin-bottom:var(--i14raqr9-1);}.Notification_styles_1u5gusp_i14raqr9__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
+.Notification_styles_1u5gusp_c157peez__dcdf3719{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_1u5gusp_c157peez__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
+.Notification_styles_1u5gusp_t1vmb0f2__dcdf3719{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_1u5gusp_t1vmb0f2__dcdf3719.Notification_styles_1u5gusp_notificationLayoutHorizontal__dcdf3719{padding:unset;}
+.Notification_styles_1u5gusp_s1k4e58v__dcdf3719{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
+.Notification_styles_1u5gusp_s92kmpm__dcdf3719{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);}
+.Notification_styles_1u5gusp_s18m0x6v__dcdf3719{margin-top:1rem;opacity:1;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemOpened__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemOpened__dcdf3719.Notification_styles_1u5gusp_notificationLeftToRightAnimation__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemHidden__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_hideAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_hideAnimationS18m0x6v__dcdf3719 ease-out;}.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_s18m0x6v__dcdf3719.Notification_styles_1u5gusp_notificationItemHidden__dcdf3719.Notification_styles_1u5gusp_notificationLeftToRightAnimation__dcdf3719{-webkit-animation:0.4s Notification_styles_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;animation:0.4s Notification_styles_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719 ease-out;}@-webkit-keyframes Notification_styles_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_showLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideLeftToRightAnimationS18m0x6v__dcdf3719{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;}}@-webkit-keyframes Notification_styles_1u5gusp_showAnimationS18m0x6v__dcdf3719{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_1u5gusp_showAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideAnimationS18m0x6v__dcdf3719{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_1u5gusp_hideAnimationS18m0x6v__dcdf3719{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;}}
+.Notification_styles_1u5gusp_sfe5ql2__dcdf3719{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:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}
 
 .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}