@skbkontur/react-ui 0.0.0-4cd450ed1e → 0.0.0-4da47ece08

package/components/Toast/Toast.md

@@ -1,41 +1,69 @@
-Вызов статических методов
-
-```jsx harmony
-import { Button, Toast } from '@skbkontur/react-ui';
-
-function showComplexNotification() {
-  Toast.push('Successfully saved', {
-    label: 'Cancel',
-    handler: () => Toast.push('Canceled'),
-  });
-}
-
-<Button onClick={showComplexNotification}>Show notification</Button>;
-```
-
-Использование `ref`
-
-```jsx harmony
-import { Button, Toast } from '@skbkontur/react-ui';
-
-class Toaster extends React.Component {
-  showNotification() {
-    this.notifier.push('Successfully');
-  }
-
-  render() {
-    return (
-      <div>
-        <Toast
-          ref={el => {
-            this.notifier = el;
-          }}
-        />
-        <Button onClick={() => this.showNotification()}>Show notification</Button>
-      </div>
-    );
-  }
-}
-
-<Toaster />;
-```
+Вызов статических методов
+
+```jsx harmony
+import { Button, Toast } from '@skbkontur/react-ui';
+
+function showComplexNotification() {
+  Toast.push('Successfully saved', {
+    label: 'Cancel',
+    handler: () => Toast.push('Canceled'),
+  });
+}
+
+<Button onClick={showComplexNotification}>Show notification</Button>;
+```
+
+C кастомным showTime
+
+```jsx harmony
+import { Button, Toast } from '@skbkontur/react-ui';
+
+function showComplexNotification() {
+  Toast.push('Successfully saved', {
+    label: 'Cancel',
+    handler: () => Toast.push('Canceled'),
+  }, 15000);
+}
+
+<Button onClick={showComplexNotification}>Show notification</Button>;
+```
+
+C кастомным showTime без action
+
+
+```jsx harmony
+import { Button, Toast } from '@skbkontur/react-ui';
+
+function showComplexNotification() {
+  Toast.push('Successfully saved', null, 15000);
+}
+
+<Button onClick={showComplexNotification}>Show notification</Button>;
+```
+
+Использование `ref`
+
+```jsx harmony
+import { Button, Toast } from '@skbkontur/react-ui';
+
+class Toaster extends React.Component {
+  showNotification() {
+    this.notifier.push('Successfully');
+  }
+
+  render() {
+    return (
+      <div>
+        <Toast
+          ref={el => {
+            this.notifier = el;
+          }}
+        />
+        <Button onClick={() => this.showNotification()}>Show notification</Button>
+      </div>
+    );
+  }
+}
+
+<Toaster />;
+```

package/components/Toast/Toast.styles/Toast.styles.js

@@ -1,58 +1,19 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n      opacity: 0.01;\n      transition: opacity 0.15s ease-out;\n    "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n      transform: translateY(0);\n      opacity: 1;\n    "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n      transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n      transform: translateY(0);\n    "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      transform: translateY(-40px);\n    "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
-var styles = {
+export var styles = memoizeStyle({
   enter: function enter() {
-    return css(_templateObject());
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      transform: translateY(-40px);\n    "])));
   },
   enterActive: function enterActive() {
-    return css(_templateObject2());
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n      transform: translateY(0) !important;\n    "])));
   },
   exit: function exit() {
-    return css(_templateObject3());
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      transform: translateY(0);\n      opacity: 1;\n    "])));
   },
   exitActive: function exitActive() {
-    return css(_templateObject4());
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      opacity: 0.01 !important;\n      transition: opacity 0.15s ease-out;\n    "])));
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

package/components/Toast/Toast.styles/Toast.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Toast.styles.ts"],"names":["css","memoizeStyle","styles","enter","enterActive","exit","exitActive","jsStyles"],"mappings":"y8BAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,IAAMC,MAAM,GAAG;AACbC,EAAAA,KADa,mBACL;AACN,WAAOH,GAAP;;;AAGD,GALY;AAMbI,EAAAA,WANa,yBAMC;AACZ,WAAOJ,GAAP;;;;AAID,GAXY;AAYbK,EAAAA,IAZa,kBAYN;AACL,WAAOL,GAAP;;;;AAID,GAjBY;AAkBbM,EAAAA,UAlBa,wBAkBA;AACX,WAAON,GAAP;;;;AAID,GAvBY,EAAf;;;AA0BA,OAAO,IAAMO,QAAQ,GAAGN,YAAY,CAACC,MAAD,CAA7B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\n\r\nconst styles = {\r\n  enter() {\r\n    return css`\r\n      transform: translateY(-40px);\r\n    `;\r\n  },\r\n  enterActive() {\r\n    return css`\r\n      transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\r\n      transform: translateY(0);\r\n    `;\r\n  },\r\n  exit() {\r\n    return css`\r\n      transform: translateY(0);\r\n      opacity: 1;\r\n    `;\r\n  },\r\n  exitActive() {\r\n    return css`\r\n      opacity: 0.01;\r\n      transition: opacity 0.15s ease-out;\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Toast.styles.ts"],"names":["css","memoizeStyle","styles","enter","enterActive","exit","exitActive"],"mappings":"0KAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,KADiC,mBACzB;AACN,WAAOH,GAAP;;;AAGD,GALgC;AAMjCI,EAAAA,WANiC,yBAMnB;AACZ,WAAOJ,GAAP;;;;AAID,GAXgC;AAYjCK,EAAAA,IAZiC,kBAY1B;AACL,WAAOL,GAAP;;;;AAID,GAjBgC;AAkBjCM,EAAAA,UAlBiC,wBAkBpB;AACX,WAAON,GAAP;;;;AAID,GAvBgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  enter() {\n    return css`\n      transform: translateY(-40px);\n    `;\n  },\n  enterActive() {\n    return css`\n      transition: transform 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);\n      transform: translateY(0) !important;\n    `;\n  },\n  exit() {\n    return css`\n      transform: translateY(0);\n      opacity: 1;\n    `;\n  },\n  exitActive() {\n    return css`\n      opacity: 0.01 !important;\n      transition: opacity 0.15s ease-out;\n    `;\n  },\n});\n"]}

package/components/Toast/Toast.styles.d.ts

@@ -1,4 +1,4 @@
-export declare const jsStyles: {
+export declare const styles: {
     enter(): string;
     enterActive(): string;
     exit(): string;

package/components/Toast/ToastStatic/ToastStatic.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Toast } from "../Toast";
+import { globalObject } from '@skbkontur/global-object';
+import { Toast, ToastDataTids } from "../Toast";
 export var ToastStatic = function ToastStatic() {};
 
-ToastStatic.push = function (notification, action) {
-  if (!ToastStatic.node) {
-    ToastStatic.node = document.createElement('div');
-    var _document = document,
-        body = _document.body;
+ToastStatic.push = function (notification, action, showTime) {
+  if (!ToastStatic.node && globalObject.document) {
+    ToastStatic.node = globalObject.document.createElement('div');
+    var body = globalObject.document.body;
 
     if (!body) {
       throw Error('There is no "body" element in "document"');
@@ -15,21 +15,21 @@ ToastStatic.push = function (notification, action) {
 
     body.appendChild(ToastStatic.node);
     ReactDOM.render( /*#__PURE__*/React.createElement(Toast, {
-      "data-tid": "StaticToast",
+      "data-tid": ToastDataTids.toastStatic,
       ref: function ref(el) {
         return ToastStatic.instance = el;
       }
     }), ToastStatic.node, function () {
-      return ToastStatic._push(notification, action);
+      return ToastStatic._push(notification, action, showTime);
     });
   } else {
-    ToastStatic._push(notification, action);
+    ToastStatic._push(notification, action, showTime);
   }
 };
 
-ToastStatic._push = function (notification, action) {
+ToastStatic._push = function (notification, action, showTime) {
   if (ToastStatic.instance) {
-    ToastStatic.instance.push(notification, action);
+    ToastStatic.instance.push(notification, action, showTime);
   }
 };
 
@@ -39,5 +39,4 @@ ToastStatic.close = function () {
   }
 };
 
-ToastStatic.node = void 0;
 ToastStatic.instance = null;

package/components/Toast/ToastStatic/ToastStatic.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ToastStatic.tsx"],"names":["React","ReactDOM","Toast","ToastStatic","push","notification","action","node","document","createElement","body","Error","appendChild","render","el","instance","_push","close"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;;;;AAIA,SAASC,KAAT,QAA8B,SAA9B;;;AAGA,WAAaC,WAAb,6BAAaA,W;AACGC,I,GAAO,UAACC,YAAD,EAAuBC,MAAvB,EAA2C;AAC9D,MAAI,CAACH,WAAW,CAACI,IAAjB,EAAuB;AACrBJ,IAAAA,WAAW,CAACI,IAAZ,GAAmBC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAnB,CADqB;AAEJD,IAAAA,QAFI,CAEbE,IAFa,aAEbA,IAFa;AAGrB,QAAI,CAACA,IAAL,EAAW;AACT,YAAMC,KAAK,CAAC,0CAAD,CAAX;AACD;AACDD,IAAAA,IAAI,CAACE,WAAL,CAAiBT,WAAW,CAACI,IAA7B;;AAEAN,IAAAA,QAAQ,CAACY,MAAT,eAAgB,oBAAC,KAAD,IAAO,YAAS,aAAhB,EAA8B,GAAG,EAAE,aAAAC,EAAE,UAAKX,WAAW,CAACY,QAAZ,GAAuBD,EAA5B,EAArC,GAAhB,EAA0FX,WAAW,CAACI,IAAtG,EAA4G;AAC1GJ,QAAAA,WAAW,CAACa,KAAZ,CAAkBX,YAAlB,EAAgCC,MAAhC,CAD0G,GAA5G;;AAGD,GAXD,MAWO;AACLH,IAAAA,WAAW,CAACa,KAAZ,CAAkBX,YAAlB,EAAgCC,MAAhC;AACD;AACF,C,CAhBUH,W;;AAkBGa,K,GAAQ,UAACX,YAAD,EAAuBC,MAAvB,EAA2C;AAC/D,MAAIH,WAAW,CAACY,QAAhB,EAA0B;AACxBZ,IAAAA,WAAW,CAACY,QAAZ,CAAqBX,IAArB,CAA0BC,YAA1B,EAAwCC,MAAxC;AACD;AACF,C,CAtBUH,W;;AAwBGc,K,GAAQ,YAAM;AAC1B,MAAId,WAAW,CAACY,QAAhB,EAA0B;AACxBZ,IAAAA,WAAW,CAACY,QAAZ,CAAqBE,KAArB;AACD;AACF,C,CA5BUd,W;;AA8BII,I,UA9BJJ,W;AA+BIY,Q,GAA4B,I","sourcesContent":["import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\n\r\nimport { Nullable } from '../../typings/utility-types';\r\n\r\nimport { Toast, Action } from './Toast';\r\n\r\n\r\nexport class ToastStatic {\r\n  public static push = (notification: string, action?: Action) => {\r\n    if (!ToastStatic.node) {\r\n      ToastStatic.node = document.createElement('div');\r\n      const { body } = document;\r\n      if (!body) {\r\n        throw Error('There is no \"body\" element in \"document\"');\r\n      }\r\n      body.appendChild(ToastStatic.node);\r\n\r\n      ReactDOM.render(<Toast data-tid=\"StaticToast\" ref={el => (ToastStatic.instance = el)} />, ToastStatic.node, () =>\r\n        ToastStatic._push(notification, action),\r\n      );\r\n    } else {\r\n      ToastStatic._push(notification, action);\r\n    }\r\n  };\r\n\r\n  public static _push = (notification: string, action?: Action) => {\r\n    if (ToastStatic.instance) {\r\n      ToastStatic.instance.push(notification, action);\r\n    }\r\n  };\r\n\r\n  public static close = () => {\r\n    if (ToastStatic.instance) {\r\n      ToastStatic.instance.close();\r\n    }\r\n  };\r\n\r\n  private static node: HTMLDivElement;\r\n  private static instance: Nullable<Toast> = null;\r\n}\r\n"]}
+{"version":3,"sources":["ToastStatic.tsx"],"names":["React","ReactDOM","globalObject","Toast","ToastDataTids","ToastStatic","push","notification","action","showTime","node","document","createElement","body","Error","appendChild","render","toastStatic","el","instance","_push","close"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;AACA,SAASC,YAAT,QAA6B,0BAA7B;;;;AAIA,SAASC,KAAT,EAAwBC,aAAxB,QAA6C,SAA7C;;AAEA,WAAaC,WAAb,6BAAaA,W;AACGC,I,GAAO,UAACC,YAAD,EAAuBC,MAAvB,EAAkDC,QAAlD,EAAwE;AAC3F,MAAI,CAACJ,WAAW,CAACK,IAAb,IAAqBR,YAAY,CAACS,QAAtC,EAAgD;AAC9CN,IAAAA,WAAW,CAACK,IAAZ,GAAmBR,YAAY,CAACS,QAAb,CAAsBC,aAAtB,CAAoC,KAApC,CAAnB;AACA,QAAQC,IAAR,GAAiBX,YAAY,CAACS,QAA9B,CAAQE,IAAR;AACA,QAAI,CAACA,IAAL,EAAW;AACT,YAAMC,KAAK,CAAC,0CAAD,CAAX;AACD;AACDD,IAAAA,IAAI,CAACE,WAAL,CAAiBV,WAAW,CAACK,IAA7B;;AAEAT,IAAAA,QAAQ,CAACe,MAAT;AACE,wBAAC,KAAD,IAAO,YAAUZ,aAAa,CAACa,WAA/B,EAA4C,GAAG,EAAE,aAACC,EAAD,UAASb,WAAW,CAACc,QAAZ,GAAuBD,EAAhC,EAAjD,GADF;AAEEb,IAAAA,WAAW,CAACK,IAFd;AAGE,wBAAML,WAAW,CAACe,KAAZ,CAAkBb,YAAlB,EAAgCC,MAAhC,EAAwCC,QAAxC,CAAN,EAHF;;AAKD,GAbD,MAaO;AACLJ,IAAAA,WAAW,CAACe,KAAZ,CAAkBb,YAAlB,EAAgCC,MAAhC,EAAwCC,QAAxC;AACD;AACF,C,CAlBUJ,W;;AAoBGe,K,GAAQ,UAACb,YAAD,EAAuBC,MAAvB,EAAkDC,QAAlD,EAAwE;AAC5F,MAAIJ,WAAW,CAACc,QAAhB,EAA0B;AACxBd,IAAAA,WAAW,CAACc,QAAZ,CAAqBb,IAArB,CAA0BC,YAA1B,EAAwCC,MAAxC,EAAgDC,QAAhD;AACD;AACF,C,CAxBUJ,W;;AA0BGgB,K,GAAQ,YAAM;AAC1B,MAAIhB,WAAW,CAACc,QAAhB,EAA0B;AACxBd,IAAAA,WAAW,CAACc,QAAZ,CAAqBE,KAArB;AACD;AACF,C,CA9BUhB,W;;;AAiCIc,Q,GAA4B,I","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { Nullable } from '../../typings/utility-types';\n\nimport { Toast, Action, ToastDataTids } from './Toast';\n\nexport class ToastStatic {\n  public static push = (notification: string, action?: Nullable<Action>, showTime?: number) => {\n    if (!ToastStatic.node && globalObject.document) {\n      ToastStatic.node = globalObject.document.createElement('div');\n      const { body } = globalObject.document;\n      if (!body) {\n        throw Error('There is no \"body\" element in \"document\"');\n      }\n      body.appendChild(ToastStatic.node);\n\n      ReactDOM.render(\n        <Toast data-tid={ToastDataTids.toastStatic} ref={(el) => (ToastStatic.instance = el)} />,\n        ToastStatic.node,\n        () => ToastStatic._push(notification, action, showTime),\n      );\n    } else {\n      ToastStatic._push(notification, action, showTime);\n    }\n  };\n\n  public static _push = (notification: string, action?: Nullable<Action>, showTime?: number) => {\n    if (ToastStatic.instance) {\n      ToastStatic.instance.push(notification, action, showTime);\n    }\n  };\n\n  public static close = () => {\n    if (ToastStatic.instance) {\n      ToastStatic.instance.close();\n    }\n  };\n\n  private static node: HTMLDivElement;\n  private static instance: Nullable<Toast> = null;\n}\n"]}

package/components/Toast/ToastStatic.d.ts

@@ -1,7 +1,8 @@
+import { Nullable } from '../../typings/utility-types';
 import { Action } from './Toast';
 export declare class ToastStatic {
-    static push: (notification: string, action?: Action | undefined) => void;
-    static _push: (notification: string, action?: Action | undefined) => void;
+    static push: (notification: string, action?: Nullable<Action>, showTime?: number | undefined) => void;
+    static _push: (notification: string, action?: Nullable<Action>, showTime?: number | undefined) => void;
     static close: () => void;
     private static node;
     private static instance;

package/components/Toast/ToastView/ToastView.js

@@ -1,14 +1,24 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _excluded = ["action", "onClose"];
+
+var _dec, _class, _class2, _temp;
+
 import React from 'react';
 import { func, shape, string } from 'prop-types';
+import { locale } from "../../../lib/locale/decorators";
 import { CrossIcon } from "../../../internal/icons/CrossIcon";
 import { ZIndex } from "../../../internal/ZIndex";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { jsStyles } from "../ToastView.styles";
-export var ToastView = /*#__PURE__*/function (_React$Component) {
+import { rootNode } from "../../../lib/rootNode";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { CloseButtonIcon } from "../../../internal/CloseButtonIcon/CloseButtonIcon";
+import { styles } from "../ToastView.styles";
+import { ToastDataTids } from "../Toast";
+import { ToastLocaleHelper } from "../locale";
+export var ToastView = (_dec = locale('Toast', ToastLocaleHelper), rootNode(_class = _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(ToastView, _React$Component);
 
   function ToastView() {
@@ -19,30 +29,50 @@ export var ToastView = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
-    _this.theme = void 0;
 
     _this.renderMain = function (props) {
       var action = props.action,
           onClose = props.onClose,
-          rest = _objectWithoutPropertiesLoose(props, ["action", "onClose"]);
+          rest = _objectWithoutPropertiesLoose(props, _excluded);
 
-      var link = action ? /*#__PURE__*/React.createElement("span", {
-        className: jsStyles.link(_this.theme),
+      var link = action ? /*#__PURE__*/React.createElement("button", {
+        "aria-label": action['aria-label'],
+        "data-tid": ToastDataTids.action,
+        className: styles.link(_this.theme),
         onClick: action.handler
       }, action.label) : null;
       var close = action ? /*#__PURE__*/React.createElement("span", {
-        className: jsStyles.closeWrapper(_this.theme)
+        className: styles.closeWrapper(_this.theme)
       }, /*#__PURE__*/React.createElement("span", {
-        className: jsStyles.close(_this.theme),
+        "aria-label": _this.locale.closeButtonAriaLabel,
+        "data-tid": ToastDataTids.close,
+        className: styles.close(_this.theme),
         onClick: onClose
       }, /*#__PURE__*/React.createElement(CrossIcon, null))) : null;
+
+      if (isTheme2022(_this.theme) && close) {
+        close = /*#__PURE__*/React.createElement("span", {
+          className: styles.closeWrapper(_this.theme)
+        }, /*#__PURE__*/React.createElement(CloseButtonIcon, {
+          "aria-label": _this.locale.closeButtonAriaLabel,
+          "data-tid": ToastDataTids.close,
+          onClick: onClose,
+          size: parseInt(_this.theme.toastCloseSize),
+          side: 40,
+          color: _this.theme.toastCloseColor,
+          colorHover: _this.theme.toastCloseHoverColor,
+          tabbable: false
+        }));
+      }
+
       return /*#__PURE__*/React.createElement(ZIndex, {
         priority: "Toast",
-        className: jsStyles.wrapper()
+        className: styles.wrapper(_this.theme)
       }, /*#__PURE__*/React.createElement("div", _extends({
-        "data-tid": "ToastView__root"
+        "data-tid": ToastDataTids.toastView
       }, rest, {
-        className: jsStyles.root(_this.theme)
+        className: styles.root(_this.theme),
+        ref: _this.setRootNode
       }), /*#__PURE__*/React.createElement("span", null, _this.props.children), link, close));
     };
 
@@ -61,19 +91,18 @@ export var ToastView = /*#__PURE__*/function (_React$Component) {
   };
 
   return ToastView;
-}(React.Component);
-ToastView.propTypes = {
-  /**
-  * Adds action handling and close icon for toast
+}(React.Component), _class2.propTypes = {
+  /**
+  * Adds action handling and close icon for toast
   */
   action: shape({
     label: string.isRequired,
     handler: func.isRequired
   }),
 
-  /**
-  * Toast content
+  /**
+  * Toast content
   */
   children: string.isRequired,
   onClose: func
-};
+}, _temp)) || _class) || _class);

package/components/Toast/ToastView/ToastView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ToastView.tsx"],"names":["React","func","shape","string","CrossIcon","ZIndex","ThemeContext","CommonWrapper","jsStyles","ToastView","theme","renderMain","props","action","onClose","rest","link","handler","label","close","closeWrapper","wrapper","root","children","render","Component","propTypes","isRequired"],"mappings":"oOAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,KAAf,EAAsBC,MAAtB,QAAoC,YAApC;;AAEA,SAASC,SAAT,QAA0B,gCAA1B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAAsBC,aAAtB,QAAmE,8BAAnE;;AAEA,SAASC,QAAT,QAAyB,oBAAzB;;;;;;;;;;;;;;;;;;;AAmBA,WAAaC,SAAb;;;;;;;;;;;;;;;;AAgBUC,IAAAA,KAhBV;;;;;;;;;;;;;AA6BUC,IAAAA,UA7BV,GA6BuB,UAACC,KAAD,EAAmD;AAC9DC,MAAAA,MAD8D,GACjCD,KADiC,CAC9DC,MAD8D,CACtDC,OADsD,GACjCF,KADiC,CACtDE,OADsD,CAC1CC,IAD0C,iCACjCH,KADiC;;AAGtE,UAAMI,IAAI,GAAGH,MAAM;AACjB,oCAAM,SAAS,EAAEL,QAAQ,CAACQ,IAAT,CAAc,MAAKN,KAAnB,CAAjB,EAA4C,OAAO,EAAEG,MAAM,CAACI,OAA5D;AACGJ,MAAAA,MAAM,CAACK,KADV,CADiB;;AAIf,UAJJ;;AAMA,UAAMC,KAAK,GAAGN,MAAM;AAClB,oCAAM,SAAS,EAAEL,QAAQ,CAACY,YAAT,CAAsB,MAAKV,KAA3B,CAAjB;AACE,oCAAM,SAAS,EAAEF,QAAQ,CAACW,KAAT,CAAe,MAAKT,KAApB,CAAjB,EAA6C,OAAO,EAAEI,OAAtD;AACE,0BAAC,SAAD,OADF,CADF,CADkB;;;AAMhB,UANJ;;AAQA;AACE,4BAAC,MAAD,IAAQ,QAAQ,EAAC,OAAjB,EAAyB,SAAS,EAAEN,QAAQ,CAACa,OAAT,EAApC;AACE,8CAAK,YAAS,iBAAd,IAAoCN,IAApC,IAA0C,SAAS,EAAEP,QAAQ,CAACc,IAAT,CAAc,MAAKZ,KAAnB,CAArD;AACE,0CAAO,MAAKE,KAAL,CAAWW,QAAlB,CADF;AAEGP,QAAAA,IAFH;AAGGG,QAAAA,KAHH,CADF,CADF;;;;AASD,KAvDH,uDAkBSK,MAlBT,GAkBE,kBAAgB,mBACd,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAAAd,KAAK,EAAI,CACR,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBAAO,oBAAC,aAAD,EAAmB,MAAI,CAACE,KAAxB,EAAgC,MAAI,CAACD,UAArC,CAAP,CACD,CAJH,CADF,CAQD,CA3BH,oBAA+BX,KAAK,CAACyB,SAArC,EAAahB,S,CACGiB,S,GAAY,EACxB;AACJ;AACA,KACIb,MAAM,EAAEX,KAAK,CAAC,EACZgB,KAAK,EAAEf,MAAM,CAACwB,UADF,EAEZV,OAAO,EAAEhB,IAAI,CAAC0B,UAFF,EAAD,CAJW,EAQxB;AACJ;AACA,KACIJ,QAAQ,EAAEpB,MAAM,CAACwB,UAXO,EAYxBb,OAAO,EAAEb,IAZe,E","sourcesContent":["import React from 'react';\r\nimport { func, shape, string } from 'prop-types';\r\n\r\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './ToastView.styles';\r\n\r\nexport interface ToastViewProps extends CommonProps {\r\n  /**\r\n   * Toast content\r\n   */\r\n  children?: string;\r\n  /**\r\n   * Adds action handling and close icon for toast\r\n   */\r\n  action?: {\r\n    label: string;\r\n    handler: () => void;\r\n  } | null;\r\n  onClose?: () => void;\r\n  onMouseEnter?: () => void;\r\n  onMouseLeave?: () => void;\r\n}\r\n\r\nexport class ToastView extends React.Component<ToastViewProps> {\r\n  public static propTypes = {\r\n    /**\r\n     * Adds action handling and close icon for toast\r\n     */\r\n    action: shape({\r\n      label: string.isRequired,\r\n      handler: func.isRequired,\r\n    }),\r\n    /**\r\n     * Toast content\r\n     */\r\n    children: string.isRequired,\r\n    onClose: func,\r\n  };\r\n\r\n  private theme!: Theme;\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return <CommonWrapper {...this.props}>{this.renderMain}</CommonWrapper>;\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  private renderMain = (props: CommonWrapperRestProps<ToastViewProps>) => {\r\n    const { action, onClose, ...rest } = props;\r\n\r\n    const link = action ? (\r\n      <span className={jsStyles.link(this.theme)} onClick={action.handler}>\r\n        {action.label}\r\n      </span>\r\n    ) : null;\r\n\r\n    const close = action ? (\r\n      <span className={jsStyles.closeWrapper(this.theme)}>\r\n        <span className={jsStyles.close(this.theme)} onClick={onClose}>\r\n          <CrossIcon />\r\n        </span>\r\n      </span>\r\n    ) : null;\r\n\r\n    return (\r\n      <ZIndex priority=\"Toast\" className={jsStyles.wrapper()}>\r\n        <div data-tid=\"ToastView__root\" {...rest} className={jsStyles.root(this.theme)}>\r\n          <span>{this.props.children}</span>\r\n          {link}\r\n          {close}\r\n        </div>\r\n      </ZIndex>\r\n    );\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["ToastView.tsx"],"names":["React","func","shape","string","locale","CrossIcon","ZIndex","ThemeContext","CommonWrapper","rootNode","isTheme2022","CloseButtonIcon","styles","ToastDataTids","ToastLocaleHelper","ToastView","renderMain","props","action","onClose","rest","link","theme","handler","label","close","closeWrapper","closeButtonAriaLabel","parseInt","toastCloseSize","toastCloseColor","toastCloseHoverColor","wrapper","toastView","root","setRootNode","children","render","Component","propTypes","isRequired"],"mappings":"2SAAA,OAAOA,KAAP,MAAsC,OAAtC;AACA,SAASC,IAAT,EAAeC,KAAf,EAAsBC,MAAtB,QAAoC,YAApC;;AAEA,SAASC,MAAT,QAAuB,6BAAvB;;AAEA,SAASC,SAAT,QAA0B,gCAA1B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,YAAT,QAA6B,gCAA7B;;AAEA,SAAsBC,aAAtB,QAAmE,8BAAnE;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,WAAT,QAA4B,gCAA5B;AACA,SAASC,eAAT,QAAgC,gDAAhC;;AAEA,SAASC,MAAT,QAAuB,oBAAvB;AACA,SAAiBC,aAAjB,QAAsC,SAAtC;AACA,SAAsBC,iBAAtB,QAA+C,UAA/C;;;;;;;;;;;;;;;;;;AAkBA,WAAaC,SAAb,WADCX,MAAM,CAAC,OAAD,EAAUU,iBAAV,CACP,EAFCL,QAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BUO,IAAAA,UA/BV,GA+BuB,UAACC,KAAD,EAAmD;AACtE,UAAQC,MAAR,GAAqCD,KAArC,CAAQC,MAAR,CAAgBC,OAAhB,GAAqCF,KAArC,CAAgBE,OAAhB,CAA4BC,IAA5B,iCAAqCH,KAArC;;AAEA,UAAMI,IAAI,GAAGH,MAAM;AACjB;AACE,sBAAYA,MAAM,CAAC,YAAD,CADpB;AAEE,oBAAUL,aAAa,CAACK,MAF1B;AAGE,QAAA,SAAS,EAAEN,MAAM,CAACS,IAAP,CAAY,MAAKC,KAAjB,CAHb;AAIE,QAAA,OAAO,EAAEJ,MAAM,CAACK,OAJlB;;AAMGL,MAAAA,MAAM,CAACM,KANV,CADiB;;AASf,UATJ;;AAWA,UAAIC,KAAK,GAAGP,MAAM;AAChB,oCAAM,SAAS,EAAEN,MAAM,CAACc,YAAP,CAAoB,MAAKJ,KAAzB,CAAjB;AACE;AACE,sBAAY,MAAKlB,MAAL,CAAYuB,oBAD1B;AAEE,oBAAUd,aAAa,CAACY,KAF1B;AAGE,QAAA,SAAS,EAAEb,MAAM,CAACa,KAAP,CAAa,MAAKH,KAAlB,CAHb;AAIE,QAAA,OAAO,EAAEH,OAJX;;AAME,0BAAC,SAAD,OANF,CADF,CADgB;;;AAWd,UAXJ;;AAaA,UAAIT,WAAW,CAAC,MAAKY,KAAN,CAAX,IAA2BG,KAA/B,EAAsC;AACpCA,QAAAA,KAAK;AACH,sCAAM,SAAS,EAAEb,MAAM,CAACc,YAAP,CAAoB,MAAKJ,KAAzB,CAAjB;AACE,4BAAC,eAAD;AACE,wBAAY,MAAKlB,MAAL,CAAYuB,oBAD1B;AAEE,sBAAUd,aAAa,CAACY,KAF1B;AAGE,UAAA,OAAO,EAAEN,OAHX;AAIE,UAAA,IAAI,EAAES,QAAQ,CAAC,MAAKN,KAAL,CAAWO,cAAZ,CAJhB;AAKE,UAAA,IAAI,EAAE,EALR;AAME,UAAA,KAAK,EAAE,MAAKP,KAAL,CAAWQ,eANpB;AAOE,UAAA,UAAU,EAAE,MAAKR,KAAL,CAAWS,oBAPzB;AAQE,UAAA,QAAQ,EAAE,KARZ,GADF,CADF;;;;AAcD;;AAED;AACE,4BAAC,MAAD,IAAQ,QAAQ,EAAC,OAAjB,EAAyB,SAAS,EAAEnB,MAAM,CAACoB,OAAP,CAAe,MAAKV,KAApB,CAApC;AACE,8CAAK,YAAUT,aAAa,CAACoB,SAA7B,IAA4Cb,IAA5C,IAAkD,SAAS,EAAER,MAAM,CAACsB,IAAP,CAAY,MAAKZ,KAAjB,CAA7D,EAAsF,GAAG,EAAE,MAAKa,WAAhG;AACE,0CAAO,MAAKlB,KAAL,CAAWmB,QAAlB,CADF;AAEGf,QAAAA,IAFH;AAGGI,QAAAA,KAHH,CADF,CADF;;;;AASD,KApFH,uDAoBSY,MApBT,GAoBE,kBAAgB,mBACd,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACf,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBAAO,oBAAC,aAAD,EAAmB,MAAI,CAACL,KAAxB,EAAgC,MAAI,CAACD,UAArC,CAAP,CACD,CAJH,CADF,CAQD,CA7BH,oBAA+BhB,KAAK,CAACsC,SAArC,WACgBC,SADhB,GAC4B,EACxB;AACJ;AACA,KACIrB,MAAM,EAAEhB,KAAK,CAAC,EACZsB,KAAK,EAAErB,MAAM,CAACqC,UADF,EAEZjB,OAAO,EAAEtB,IAAI,CAACuC,UAFF,EAAD,CAJW,EAQxB;AACJ;AACA,KACIJ,QAAQ,EAAEjC,MAAM,CAACqC,UAXO,EAYxBrB,OAAO,EAAElB,IAZe,EAD5B","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport { func, shape, string } from 'prop-types';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { Nullable } from '../../typings/utility-types';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { CloseButtonIcon } from '../../internal/CloseButtonIcon/CloseButtonIcon';\n\nimport { styles } from './ToastView.styles';\nimport { Action, ToastDataTids } from './Toast';\nimport { ToastLocale, ToastLocaleHelper } from './locale';\n\nexport interface ToastViewProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n  /**\n   * Toast content\n   */\n  children?: string;\n  /**\n   * Adds action handling and close icon for toast\n   */\n  action?: Nullable<Action>;\n  onClose?: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n}\n\n@rootNode\n@locale('Toast', ToastLocaleHelper)\nexport class ToastView extends React.Component<ToastViewProps> {\n  public static propTypes = {\n    /**\n     * Adds action handling and close icon for toast\n     */\n    action: shape({\n      label: string.isRequired,\n      handler: func.isRequired,\n    }),\n    /**\n     * Toast content\n     */\n    children: string.isRequired,\n    onClose: func,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n  private readonly locale!: ToastLocale;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return <CommonWrapper {...this.props}>{this.renderMain}</CommonWrapper>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain = (props: CommonWrapperRestProps<ToastViewProps>) => {\n    const { action, onClose, ...rest } = props;\n\n    const link = action ? (\n      <button\n        aria-label={action['aria-label']}\n        data-tid={ToastDataTids.action}\n        className={styles.link(this.theme)}\n        onClick={action.handler}\n      >\n        {action.label}\n      </button>\n    ) : null;\n\n    let close = action ? (\n      <span className={styles.closeWrapper(this.theme)}>\n        <span\n          aria-label={this.locale.closeButtonAriaLabel}\n          data-tid={ToastDataTids.close}\n          className={styles.close(this.theme)}\n          onClick={onClose}\n        >\n          <CrossIcon />\n        </span>\n      </span>\n    ) : null;\n\n    if (isTheme2022(this.theme) && close) {\n      close = (\n        <span className={styles.closeWrapper(this.theme)}>\n          <CloseButtonIcon\n            aria-label={this.locale.closeButtonAriaLabel}\n            data-tid={ToastDataTids.close}\n            onClick={onClose}\n            size={parseInt(this.theme.toastCloseSize)}\n            side={40}\n            color={this.theme.toastCloseColor}\n            colorHover={this.theme.toastCloseHoverColor}\n            tabbable={false}\n          />\n        </span>\n      );\n    }\n\n    return (\n      <ZIndex priority=\"Toast\" className={styles.wrapper(this.theme)}>\n        <div data-tid={ToastDataTids.toastView} {...rest} className={styles.root(this.theme)} ref={this.setRootNode}>\n          <span>{this.props.children}</span>\n          {link}\n          {close}\n        </div>\n      </ZIndex>\n    );\n  };\n}\n"]}

package/components/Toast/ToastView.d.ts

@@ -1,6 +1,8 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
+import { Nullable } from '../../typings/utility-types';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface ToastViewProps extends CommonProps {
+import { Action } from './Toast';
+export interface ToastViewProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {
     /**
      * Toast content
      */
@@ -8,10 +10,7 @@ export interface ToastViewProps extends CommonProps {
     /**
      * Adds action handling and close icon for toast
      */
-    action?: {
-        label: string;
-        handler: () => void;
-    } | null;
+    action?: Nullable<Action>;
     onClose?: () => void;
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;
@@ -32,6 +31,8 @@ export declare class ToastView extends React.Component<ToastViewProps> {
         onClose: import("prop-types").Requireable<(...args: any[]) => any>;
     };
     private theme;
+    private setRootNode;
+    private readonly locale;
     render(): JSX.Element;
     private renderMain;
 }

package/components/Toast/ToastView.styles/ToastView.styles.js

@@ -1,56 +1,9 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 
-function _templateObject5() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      height: ", ";\n      line-height: 0;\n      padding: ", ";\n      text-align: center;\n      width: ", ";\n\n      &:hover {\n        color: ", ";\n      }\n    "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n\n      margin: -", " ", " -", " ", ";\n\n      padding: ", " 0 ", ";\n\n      &:hover {\n        text-decoration: underline;\n      }\n    "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: flex;\n      margin: -", " -", " -", " -", ";\n    "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n    "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      border-radius: ", ";\n      border: ", ";\n      color: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
 
 var getVerticalPaddingsWithCompensation = function getVerticalPaddingsWithCompensation(theme) {
   var toastPaddingY = theme.toastPaddingY,
@@ -60,23 +13,23 @@ var getVerticalPaddingsWithCompensation = function getVerticalPaddingsWithCompen
   return [paddingY - compensation + "px", paddingY + compensation + "px"];
 };
 
-var styles = {
+export var styles = memoizeStyle({
   root: function root(t) {
     var _getVerticalPaddingsW = getVerticalPaddingsWithCompensation(t),
         paddingTop = _getVerticalPaddingsW[0],
         paddingBottom = _getVerticalPaddingsW[1];
 
-    return css(_templateObject(), t.toastBg, t.toastBorderRadius, t.toastBorder, t.toastColor, t.toastFontSize, t.toastLineHeight, paddingTop, t.toastPaddingX, paddingBottom, t.toastTop);
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      border-radius: ", ";\n      border: ", ";\n      color: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "])), t.toastBg, t.toastBorderRadius, t.toastBorder, t.toastColor, t.toastFontSize, t.toastLineHeight, paddingTop, t.toastPaddingX, paddingBottom, t.toastTop);
   },
-  wrapper: function wrapper() {
-    return css(_templateObject2());
+  wrapper: function wrapper(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ", ";\n    "])), t.toastBorderRadius);
   },
   closeWrapper: function closeWrapper(t) {
     var _getVerticalPaddingsW2 = getVerticalPaddingsWithCompensation(t),
         paddingTop = _getVerticalPaddingsW2[0],
         paddingBottom = _getVerticalPaddingsW2[1];
 
-    return css(_templateObject3(), paddingTop, t.toastPaddingX, paddingBottom, t.toastClosePadding);
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      margin: -", " -", " -", " -", ";\n    "])), paddingTop, t.toastPaddingX, paddingBottom, t.toastClosePadding);
   },
   link: function link(t) {
     var _getVerticalPaddingsW3 = getVerticalPaddingsWithCompensation(t),
@@ -84,10 +37,10 @@ var styles = {
         paddingBottom = _getVerticalPaddingsW3[1];
 
     var marginRight = Math.round(parseInt(t.toastPaddingX) * 1.5) + "px";
-    return css(_templateObject4(), t.toastLinkColor, paddingTop, marginRight, paddingBottom, t.toastPaddingX, paddingTop, paddingBottom);
+    var padding = isTheme2022(t) ? paddingTop + " " + paddingBottom : paddingTop + " 0 " + paddingBottom;
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      border: none;\n      font: inherit;\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -", " ", " -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])), t.toastLinkColor, paddingTop, marginRight, paddingBottom, t.toastPaddingX, padding, t.transitionDuration, t.transitionTimingFunction, t.toastLinkBgHover, t.toastLinkTextDecorationHover, t.toastLinkBgActive);
   },
   close: function close(t) {
-    return css(_templateObject5(), t.toastCloseColor, t.toastCloseSize, t.toastClosePadding, t.toastCloseSize, t.toastCloseHoverColor);
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      box-sizing: content-box !important; // fix \"reset.css\" problem\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      height: ", ";\n      line-height: 0;\n      padding: ", ";\n      text-align: center;\n      width: ", ";\n\n      &:hover {\n        color: ", ";\n      }\n    "])), t.toastCloseColor, t.toastCloseSize, t.toastClosePadding, t.toastCloseSize, t.toastCloseHoverColor);
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

package/components/Toast/ToastView.styles/ToastView.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ToastView.styles.ts"],"names":["css","memoizeStyle","getVerticalPaddingsWithCompensation","theme","toastPaddingY","fontFamilyCompensationBaseline","paddingY","parseInt","compensation","styles","root","t","paddingTop","paddingBottom","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","toastClosePadding","link","marginRight","Math","round","toastLinkColor","close","toastCloseColor","toastCloseSize","toastCloseHoverColor","jsStyles"],"mappings":"4vDAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,IAAMC,mCAAmC,GAAG,SAAtCA,mCAAsC,CAACC,KAAD,EAAkB;AACpDC,EAAAA,aADoD,GACFD,KADE,CACpDC,aADoD,CACrCC,8BADqC,GACFF,KADE,CACrCE,8BADqC;AAE5D,MAAMC,QAAQ,GAAGC,QAAQ,CAACH,aAAD,CAAzB;AACA,MAAMI,YAAY,GAAGD,QAAQ,CAACF,8BAAD,CAA7B;AACA,SAAO,CAAIC,QAAQ,GAAGE,YAAf,SAAoCF,QAAQ,GAAGE,YAA/C,QAAP;AACD,CALD;;AAOA,IAAMC,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACuBT,IAAAA,mCAAmC,CAACS,CAAD,CAD1D,CACNC,UADM,4BACMC,aADN;AAEb,WAAOb,GAAP;AACgBW,IAAAA,CAAC,CAACG,OADlB;AAEmBH,IAAAA,CAAC,CAACI,iBAFrB;AAGYJ,IAAAA,CAAC,CAACK,WAHd;AAIWL,IAAAA,CAAC,CAACM,UAJb;;AAMeN,IAAAA,CAAC,CAACO,aANjB;AAOiBP,IAAAA,CAAC,CAACQ,eAPnB;;AASaP,IAAAA,UATb,EAS2BD,CAAC,CAACS,aAT7B,EAS8CP,aAT9C;;AAWSF,IAAAA,CAAC,CAACU,QAXX;;AAaD,GAhBY;;AAkBbC,EAAAA,OAlBa,qBAkBH;AACR,WAAOtB,GAAP;;;;;;;;AAQD,GA3BY;;AA6BbuB,EAAAA,YA7Ba,wBA6BAZ,CA7BA,EA6BU;AACeT,IAAAA,mCAAmC,CAACS,CAAD,CADlD,CACdC,UADc,6BACFC,aADE;AAErB,WAAOb,GAAP;;AAEaY,IAAAA,UAFb,EAE4BD,CAAC,CAACS,aAF9B,EAEgDP,aAFhD,EAEkEF,CAAC,CAACa,iBAFpE;;AAID,GAnCY;;AAqCbC,EAAAA,IArCa,gBAqCRd,CArCQ,EAqCE;AACuBT,IAAAA,mCAAmC,CAACS,CAAD,CAD1D,CACNC,UADM,6BACMC,aADN;AAEb,QAAMa,WAAW,GAAMC,IAAI,CAACC,KAAL,CAAWrB,QAAQ,CAACI,CAAC,CAACS,aAAH,CAAR,GAA4B,GAAvC,CAAN,OAAjB;AACA,WAAOpB,GAAP;AACWW,IAAAA,CAAC,CAACkB,cADb;;;;;AAMajB,IAAAA,UANb,EAM2Bc,WAN3B,EAM2Cb,aAN3C,EAM4DF,CAAC,CAACS,aAN9D;;AAQaR,IAAAA,UARb,EAQ6BC,aAR7B;;;;;;AAcD,GAtDY;;AAwDbiB,EAAAA,KAxDa,iBAwDPnB,CAxDO,EAwDG;AACd,WAAOX,GAAP;AACWW,IAAAA,CAAC,CAACoB,eADb;;;AAIYpB,IAAAA,CAAC,CAACqB,cAJd;;AAMarB,IAAAA,CAAC,CAACa,iBANf;;AAQWb,IAAAA,CAAC,CAACqB,cARb;;;AAWarB,IAAAA,CAAC,CAACsB,oBAXf;;;AAcD,GAvEY,EAAf;;;AA0EA,OAAO,IAAMC,QAAQ,GAAGjC,YAAY,CAACQ,MAAD,CAA7B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst getVerticalPaddingsWithCompensation = (theme: Theme) => {\r\n  const { toastPaddingY, fontFamilyCompensationBaseline } = theme;\r\n  const paddingY = parseInt(toastPaddingY);\r\n  const compensation = parseInt(fontFamilyCompensationBaseline);\r\n  return [`${paddingY - compensation}px`, `${paddingY + compensation}px`];\r\n};\r\n\r\nconst styles = {\r\n  root(t: Theme) {\r\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\r\n    return css`\r\n      background: ${t.toastBg};\r\n      border-radius: ${t.toastBorderRadius};\r\n      border: ${t.toastBorder};\r\n      color: ${t.toastColor};\r\n      display: inline-flex;\r\n      font-size: ${t.toastFontSize};\r\n      line-height: ${t.toastLineHeight};\r\n      opacity: 1;\r\n      padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\r\n      position: relative;\r\n      top: ${t.toastTop};\r\n    `;\r\n  },\r\n\r\n  wrapper() {\r\n    return css`\r\n      position: fixed;\r\n      top: 0;\r\n      left: 0;\r\n      right: 0;\r\n      height: 0;\r\n      text-align: center;\r\n    `;\r\n  },\r\n\r\n  closeWrapper(t: Theme) {\r\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\r\n    return css`\r\n      display: flex;\r\n      margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} -${t.toastClosePadding};\r\n    `;\r\n  },\r\n\r\n  link(t: Theme) {\r\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\r\n    const marginRight = `${Math.round(parseInt(t.toastPaddingX) * 1.5)}px`;\r\n    return css`\r\n      color: ${t.toastLinkColor};\r\n      cursor: pointer;\r\n      display: inline-block;\r\n      font-weight: 600;\r\n\r\n      margin: -${paddingTop} ${marginRight} -${paddingBottom} ${t.toastPaddingX};\r\n\r\n      padding: ${paddingTop} 0 ${paddingBottom};\r\n\r\n      &:hover {\r\n        text-decoration: underline;\r\n      }\r\n    `;\r\n  },\r\n\r\n  close(t: Theme) {\r\n    return css`\r\n      color: ${t.toastCloseColor};\r\n      cursor: pointer;\r\n      display: inline-block;\r\n      height: ${t.toastCloseSize};\r\n      line-height: 0;\r\n      padding: ${t.toastClosePadding};\r\n      text-align: center;\r\n      width: ${t.toastCloseSize};\r\n\r\n      &:hover {\r\n        color: ${t.toastCloseHoverColor};\r\n      }\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["ToastView.styles.ts"],"names":["css","memoizeStyle","isTheme2022","getVerticalPaddingsWithCompensation","theme","toastPaddingY","fontFamilyCompensationBaseline","paddingY","parseInt","compensation","styles","root","t","paddingTop","paddingBottom","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","toastClosePadding","link","marginRight","Math","round","padding","toastLinkColor","transitionDuration","transitionTimingFunction","toastLinkBgHover","toastLinkTextDecorationHover","toastLinkBgActive","close","toastCloseColor","toastCloseSize","toastCloseHoverColor"],"mappings":"4LAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,SAASC,WAAT,QAA4B,gCAA5B;;AAEA,IAAMC,mCAAmC,GAAG,SAAtCA,mCAAsC,CAACC,KAAD,EAAkB;AAC5D,MAAQC,aAAR,GAA0DD,KAA1D,CAAQC,aAAR,CAAuBC,8BAAvB,GAA0DF,KAA1D,CAAuBE,8BAAvB;AACA,MAAMC,QAAQ,GAAGC,QAAQ,CAACH,aAAD,CAAzB;AACA,MAAMI,YAAY,GAAGD,QAAQ,CAACF,8BAAD,CAA7B;AACA,SAAO,CAAIC,QAAQ,GAAGE,YAAf,SAAoCF,QAAQ,GAAGE,YAA/C,QAAP;AACD,CALD;;AAOA,OAAO,IAAMC,MAAM,GAAGT,YAAY,CAAC;AACjCU,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,gCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,4BAAmBC,aAAnB;AACA,WAAOd,GAAP;AACgBY,IAAAA,CAAC,CAACG,OADlB;AAEmBH,IAAAA,CAAC,CAACI,iBAFrB;AAGYJ,IAAAA,CAAC,CAACK,WAHd;AAIWL,IAAAA,CAAC,CAACM,UAJb;;AAMeN,IAAAA,CAAC,CAACO,aANjB;AAOiBP,IAAAA,CAAC,CAACQ,eAPnB;;AASaP,IAAAA,UATb,EAS2BD,CAAC,CAACS,aAT7B,EAS8CP,aAT9C;;AAWSF,IAAAA,CAAC,CAACU,QAXX;;AAaD,GAhBgC;;AAkBjCC,EAAAA,OAlBiC,mBAkBzBX,CAlByB,EAkBf;AAChB,WAAOZ,GAAP;;;;;;;AAOmBY,IAAAA,CAAC,CAACI,iBAPrB;;AASD,GA5BgC;;AA8BjCQ,EAAAA,YA9BiC,wBA8BpBZ,CA9BoB,EA8BV;AACrB,iCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,6BAAmBC,aAAnB;AACA,WAAOd,GAAP;;AAEaa,IAAAA,UAFb,EAE4BD,CAAC,CAACS,aAF9B,EAEgDP,aAFhD,EAEkEF,CAAC,CAACa,iBAFpE;;AAID,GApCgC;;AAsCjCC,EAAAA,IAtCiC,gBAsC5Bd,CAtC4B,EAsClB;AACb,iCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,6BAAmBC,aAAnB;AACA,QAAMa,WAAW,GAAMC,IAAI,CAACC,KAAL,CAAWrB,QAAQ,CAACI,CAAC,CAACS,aAAH,CAAR,GAA4B,GAAvC,CAAN,OAAjB;AACA,QAAMS,OAAO,GAAG5B,WAAW,CAACU,CAAD,CAAX,GAAoBC,UAApB,SAAkCC,aAAlC,GAAuDD,UAAvD,WAAuEC,aAAvF;;AAEA,WAAOd,GAAP;;;AAGWY,IAAAA,CAAC,CAACmB,cAHb;;;;;;AASalB,IAAAA,UATb,EAS2Bc,WAT3B,EAS2Cb,aAT3C,EAS4DF,CAAC,CAACS,aAT9D;;AAWaS,IAAAA,OAXb;AAY2BlB,IAAAA,CAAC,CAACoB,kBAZ7B,EAYmDpB,CAAC,CAACqB,wBAZrD;;AAckBrB,IAAAA,CAAC,CAACsB,gBAdpB;AAeuBtB,IAAAA,CAAC,CAACuB,4BAfzB;;;;AAmBkBvB,IAAAA,CAAC,CAACwB,iBAnBpB;;;AAsBD,GAjEgC;;AAmEjCC,EAAAA,KAnEiC,iBAmE3BzB,CAnE2B,EAmEjB;AACd,WAAOZ,GAAP;;AAEWY,IAAAA,CAAC,CAAC0B,eAFb;;;AAKY1B,IAAAA,CAAC,CAAC2B,cALd;;AAOa3B,IAAAA,CAAC,CAACa,iBAPf;;AASWb,IAAAA,CAAC,CAAC2B,cATb;;;AAYa3B,IAAAA,CAAC,CAAC4B,oBAZf;;;AAeD,GAnFgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nconst getVerticalPaddingsWithCompensation = (theme: Theme) => {\n  const { toastPaddingY, fontFamilyCompensationBaseline } = theme;\n  const paddingY = parseInt(toastPaddingY);\n  const compensation = parseInt(fontFamilyCompensationBaseline);\n  return [`${paddingY - compensation}px`, `${paddingY + compensation}px`];\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      background: ${t.toastBg};\n      border-radius: ${t.toastBorderRadius};\n      border: ${t.toastBorder};\n      color: ${t.toastColor};\n      display: inline-flex;\n      font-size: ${t.toastFontSize};\n      line-height: ${t.toastLineHeight};\n      opacity: 1;\n      padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n      position: relative;\n      top: ${t.toastTop};\n    `;\n  },\n\n  wrapper(t: Theme) {\n    return css`\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ${t.toastBorderRadius};\n    `;\n  },\n\n  closeWrapper(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      display: flex;\n      margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} -${t.toastClosePadding};\n    `;\n  },\n\n  link(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    const marginRight = `${Math.round(parseInt(t.toastPaddingX) * 1.5)}px`;\n    const padding = isTheme2022(t) ? `${paddingTop} ${paddingBottom}` : `${paddingTop} 0 ${paddingBottom}`;\n\n    return css`\n      border: none;\n      font: inherit;\n      color: ${t.toastLinkColor};\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -${paddingTop} ${marginRight} -${paddingBottom} ${t.toastPaddingX};\n\n      padding: ${padding};\n      transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n      &:hover {\n        background: ${t.toastLinkBgHover};\n        text-decoration: ${t.toastLinkTextDecorationHover};\n      }\n\n      &:active {\n        background: ${t.toastLinkBgActive};\n      }\n    `;\n  },\n\n  close(t: Theme) {\n    return css`\n      box-sizing: content-box !important; // fix \"reset.css\" problem\n      color: ${t.toastCloseColor};\n      cursor: pointer;\n      display: inline-block;\n      height: ${t.toastCloseSize};\n      line-height: 0;\n      padding: ${t.toastClosePadding};\n      text-align: center;\n      width: ${t.toastCloseSize};\n\n      &:hover {\n        color: ${t.toastCloseHoverColor};\n      }\n    `;\n  },\n});\n"]}

package/components/Toast/ToastView.styles.d.ts

@@ -1,7 +1,8 @@
-export declare const jsStyles: {
-    root(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    wrapper(): string;
-    closeWrapper(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    link(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    close(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    wrapper(t: Theme): string;
+    closeWrapper(t: Theme): string;
+    link(t: Theme): string;
+    close(t: Theme): string;
 };

package/components/Toast/index/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd","sourcesContent":["export * from './Toast';\r\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd","sourcesContent":["export * from './Toast';\n"]}

package/components/Toast/locale/index/index.js

@@ -0,0 +1,8 @@
+import { LocaleHelper } from "../../../../lib/locale/LocaleHelper";
+import { componentsLocales as en_GB } from "../locales/en";
+import { componentsLocales as ru_RU } from "../locales/ru";
+export * from "../types";
+export var ToastLocaleHelper = new LocaleHelper({
+  ru_RU: ru_RU,
+  en_GB: en_GB
+});