@skbkontur/react-ui 0.0.0-044e274f2c → 0.0.0-07d08325b0

package/cjs/components/Toast/ToastView.js

@@ -1,16 +1,14 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ToastView = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
 
-
 var _decorators = require("../../lib/locale/decorators");
 
 var _ZIndex = require("../../internal/ZIndex");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _rootNode = require("../../lib/rootNode");
 var _CloseButtonIcon = require("../../internal/CloseButtonIcon/CloseButtonIcon");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
-var _Emotion = require("../../lib/theming/Emotion");
 
 var _ToastView2 = require("./ToastView.styles");
 var _Toast = require("./Toast");
@@ -29,9 +27,6 @@ var _locale = require("./locale");var _dec, _class, _ToastView;var
 
 
 
-
-
-
 ToastView = exports.ToastView = (_dec = (0, _decorators.locale)('Toast', _locale.ToastLocaleHelper), (0, _rootNode.rootNode)(_class = _dec(_class = (_ToastView = /*#__PURE__*/function (_React$Component) {function ToastView() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
@@ -52,16 +47,6 @@ ToastView = exports.ToastView = (_dec = (0, _decorators.locale)('Toast', _locale
 
 
 
-
-
-
-
-
-
-
-
-
-
 
 
 
@@ -74,22 +59,22 @@ ToastView = exports.ToastView = (_dec = (0, _decorators.locale)('Toast', _locale
 
 
     renderMain = function () {
-      var _this$props = _this.props,action = _this$props.action,onClose = _this$props.onClose,onMouseEnter = _this$props.onMouseEnter,onMouseLeave = _this$props.onMouseLeave;
-      var styles = _this.styles;
+      var _this$props = _this.props,action = _this$props.action,showCloseIcon = _this$props.showCloseIcon,onClose = _this$props.onClose,onMouseEnter = _this$props.onMouseEnter,onMouseLeave = _this$props.onMouseLeave;
 
       var link = action ? /*#__PURE__*/
       _react.default.createElement("button", {
         "aria-label": action['aria-label'],
         "data-tid": _Toast.ToastDataTids.action,
-        className: styles.link(_this.theme),
+        className: _ToastView2.styles.link(_this.theme),
         onClick: action.handler },
 
       action.label
       ) :
       null;
 
-      var close = action ? /*#__PURE__*/
-      _react.default.createElement("span", { className: styles.closeWrapper(_this.theme) }, /*#__PURE__*/
+      var close =
+      action || showCloseIcon ? /*#__PURE__*/
+      _react.default.createElement("span", { className: _ToastView2.styles.closeWrapper(_this.theme) }, /*#__PURE__*/
       _react.default.createElement(_CloseButtonIcon.CloseButtonIcon, {
         "aria-label": _this.locale.closeButtonAriaLabel,
         "data-tid": _Toast.ToastDataTids.close,
@@ -105,10 +90,10 @@ ToastView = exports.ToastView = (_dec = (0, _decorators.locale)('Toast', _locale
 
       return /*#__PURE__*/(
         _react.default.createElement(_CommonWrapper.CommonWrapper, _this.props, /*#__PURE__*/
-        _react.default.createElement(_ZIndex.ZIndex, { priority: "Toast", className: styles.wrapper(_this.theme) }, /*#__PURE__*/
+        _react.default.createElement(_ZIndex.ZIndex, { priority: "Toast", className: _ToastView2.styles.wrapper(_this.theme) }, /*#__PURE__*/
         _react.default.createElement("div", {
           "data-tid": _Toast.ToastDataTids.toastView,
-          className: styles.root(_this.theme),
+          className: _ToastView2.styles.root(_this.theme),
           ref: _this.setRootNode,
           onMouseEnter: onMouseEnter,
           onMouseLeave: onMouseLeave }, /*#__PURE__*/
@@ -120,7 +105,7 @@ ToastView = exports.ToastView = (_dec = (0, _decorators.locale)('Toast', _locale
         )
         ));
 
-    };return _this;}(0, _inheritsLoose2.default)(ToastView, _React$Component);var _proto = ToastView.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _ToastView2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};return ToastView;}(_react.default.Component), _ToastView.propTypes = { /**
+    };return _this;}(0, _inheritsLoose2.default)(ToastView, _React$Component);var _proto = ToastView.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};return ToastView;}(_react.default.Component), _ToastView.propTypes = { /**
    * Adds action handling and close icon for toast
    */action: (0, _propTypes.shape)({ label: _propTypes.string.isRequired, handler: _propTypes.func.isRequired }), /**
    * Toast content

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_propTypes","_decorators","_ZIndex","_CommonWrapper","_rootNode","_CloseButtonIcon","_ThemeContext","_Emotion","_ToastView2","_Toast","_locale","_dec","_class","_ToastView","ToastView","exports","locale","ToastLocaleHelper","rootNode","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","renderMain","_this$props","props","action","onClose","onMouseEnter","onMouseLeave","styles","link","default","createElement","ToastDataTids","className","theme","onClick","handler","label","close","closeWrapper","CloseButtonIcon","closeButtonAriaLabel","size","parseInt","toastCloseSize","side","color","toastCloseColor","colorHover","toastCloseHoverColor","tabbable","CommonWrapper","ZIndex","priority","wrapper","toastView","root","ref","setRootNode","children","_inheritsLoose2","_proto","prototype","render","_this2","EmotionConsumer","emotion","getStyles","ThemeContext","Consumer","React","Component","propTypes","shape","string","isRequired","func"],"sources":["ToastView.tsx"],"sourcesContent":["import React, { AriaAttributes } from 'react';\nimport { func, shape, string } from 'prop-types';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { locale } from '../../lib/locale/decorators';\nimport { Nullable } from '../../typings/utility-types';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { CloseButtonIcon } from '../../internal/CloseButtonIcon/CloseButtonIcon';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\n\nimport { getStyles } 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 emotion!: Emotion;\n  private styles!: ReturnType<typeof getStyles>;\n  private setRootNode!: TSetRootNode;\n  private readonly locale!: ToastLocale;\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          this.styles = getStyles(this.emotion);\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = theme;\n                return this.renderMain();\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  private renderMain = () => {\n    const { action, onClose, onMouseEnter, onMouseLeave } = this.props;\n    const styles = this.styles;\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    const close = action ? (\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    ) : null;\n\n    return (\n      <CommonWrapper {...this.props}>\n        <ZIndex priority=\"Toast\" className={styles.wrapper(this.theme)}>\n          <div\n            data-tid={ToastDataTids.toastView}\n            className={styles.root(this.theme)}\n            ref={this.setRootNode}\n            onMouseEnter={onMouseEnter}\n            onMouseLeave={onMouseLeave}\n          >\n            <span>{this.props.children}</span>\n            {link}\n            {close}\n          </div>\n        </ZIndex>\n      </CommonWrapper>\n    );\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_propTypes","_decorators","_ZIndex","_ThemeContext","_CommonWrapper","_rootNode","_CloseButtonIcon","_ToastView2","_Toast","_locale","_dec","_class","_ToastView","ToastView","exports","locale","ToastLocaleHelper","rootNode","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","renderMain","_this$props","props","action","showCloseIcon","onClose","onMouseEnter","onMouseLeave","link","default","createElement","ToastDataTids","className","styles","theme","onClick","handler","label","close","closeWrapper","CloseButtonIcon","closeButtonAriaLabel","size","parseInt","toastCloseSize","side","color","toastCloseColor","colorHover","toastCloseHoverColor","tabbable","CommonWrapper","ZIndex","priority","wrapper","toastView","root","ref","setRootNode","children","_inheritsLoose2","_proto","prototype","render","_this2","ThemeContext","Consumer","React","Component","propTypes","shape","string","isRequired","func"],"sources":["ToastView.tsx"],"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 { ZIndex } from '../../internal/ZIndex';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\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  children?: string;\n  /** Добавляет возможность действия и кнопку закрытия у тоста. */\n  action?: Nullable<Action>;\n  showCloseIcon?: boolean;\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 this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain = () => {\n    const { action, showCloseIcon, onClose, onMouseEnter, onMouseLeave } = this.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    const close =\n      action || showCloseIcon ? (\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      ) : null;\n\n    return (\n      <CommonWrapper {...this.props}>\n        <ZIndex priority=\"Toast\" className={styles.wrapper(this.theme)}>\n          <div\n            data-tid={ToastDataTids.toastView}\n            className={styles.root(this.theme)}\n            ref={this.setRootNode}\n            onMouseEnter={onMouseEnter}\n            onMouseLeave={onMouseLeave}\n          >\n            <span>{this.props.children}</span>\n            {link}\n            {close}\n          </div>\n        </ZIndex>\n      </CommonWrapper>\n    );\n  };\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,6 +1,5 @@
-import type { Emotion } from '@emotion/css/create-instance';
 import { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(t: Theme): string;
     wrapper(t: Theme): string;
     closeWrapper(t: Theme): string;

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

@@ -1,6 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
-
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
 
 var getVerticalPaddings = function getVerticalPaddings(theme) {
@@ -10,70 +8,69 @@ var getVerticalPaddings = function getVerticalPaddings(theme) {
   return [paddingY + "px", paddingY + "px"];
 };
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      root: function root(t) {
-        var _getVerticalPaddings = getVerticalPaddings(t),paddingTop = _getVerticalPaddings[0],paddingBottom = _getVerticalPaddings[1];
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\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,
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  root: function root(t) {
+    var _getVerticalPaddings = getVerticalPaddings(t),paddingTop = _getVerticalPaddings[0],paddingBottom = _getVerticalPaddings[1];
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\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,
+    t.toastFontSize,
+    t.toastLineHeight,
 
-        paddingTop, t.toastPaddingX, paddingBottom,
+    paddingTop, t.toastPaddingX, paddingBottom,
 
-        t.toastTop);
+    t.toastTop);
 
-      },
+  },
 
-      wrapper: function wrapper(t) {
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: fixed;\n        top: 0;\n        left: 0;\n        right: 0;\n        height: 0;\n        text-align: center;\n        border-radius: ", ";\n      "])),
+  wrapper: function wrapper(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\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);
+    t.toastBorderRadius);
 
-      },
+  },
 
-      closeWrapper: function closeWrapper(t) {
-        var _getVerticalPaddings2 = getVerticalPaddings(t),paddingTop = _getVerticalPaddings2[0],paddingBottom = _getVerticalPaddings2[1];
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: flex;\n        margin: -", " -", " -", " -", ";\n      "])),
+  closeWrapper: function closeWrapper(t) {
+    var _getVerticalPaddings2 = getVerticalPaddings(t),paddingTop = _getVerticalPaddings2[0],paddingBottom = _getVerticalPaddings2[1];
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "])),
 
-        paddingTop, t.toastPaddingX, paddingBottom, t.toastClosePadding);
+    paddingTop, t.toastPaddingX, paddingBottom);
 
-      },
+  },
 
-      link: function link(t) {
-        var _getVerticalPaddings3 = getVerticalPaddings(t),paddingTop = _getVerticalPaddings3[0],paddingBottom = _getVerticalPaddings3[1];
-        var padding = paddingTop + " " + t.toastLinkPadding;
+  link: function link(t) {
+    var _getVerticalPaddings3 = getVerticalPaddings(t),paddingTop = _getVerticalPaddings3[0],paddingBottom = _getVerticalPaddings3[1];
+    var padding = paddingTop + " " + t.toastLinkPadding;
 
-        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\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      "])),
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\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: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])),
 
 
-        t.toastLinkColor,
+    t.toastLinkColor,
 
 
 
 
 
-        paddingTop, t.toastPaddingX, paddingBottom, t.toastPaddingX,
+    paddingTop, paddingBottom, t.toastPaddingX,
 
-        padding,
-        t.transitionDuration, t.transitionTimingFunction,
+    padding,
+    t.transitionDuration, t.transitionTimingFunction,
 
-        t.toastLinkBgHover,
-        t.toastLinkTextDecorationHover,
+    t.toastLinkBgHover,
+    t.toastLinkTextDecorationHover,
 
 
 
-        t.toastLinkBgActive);
+    t.toastLinkBgActive);
 
 
-      }
-    }));};
+  }
+});

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

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","getVerticalPaddings","theme","toastPaddingY","paddingY","parseInt","getStyles","exports","emotion","memoizeStyle","root","t","_getVerticalPaddings","paddingTop","paddingBottom","css","_taggedTemplateLiteralLoose2","default","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","_getVerticalPaddings2","toastClosePadding","link","_getVerticalPaddings3","padding","toastLinkPadding","toastLinkColor","transitionDuration","transitionTimingFunction","toastLinkBgHover","toastLinkTextDecorationHover","toastLinkBgActive"],"sources":["ToastView.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst getVerticalPaddings = (theme: Theme) => {\n  const { toastPaddingY } = theme;\n  const paddingY = parseInt(toastPaddingY);\n\n  return [`${paddingY}px`, `${paddingY}px`];\n};\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root(t: Theme) {\n      const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n      return emotion.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 emotion.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] = getVerticalPaddings(t);\n      return emotion.css`\n        display: flex;\n        margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} -${t.toastClosePadding};\n      `;\n    },\n\n    link(t: Theme) {\n      const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n      const padding = `${paddingTop} ${t.toastLinkPadding}`;\n\n      return emotion.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} ${t.toastPaddingX} -${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"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA,8BAAyD,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAGzD,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIC,KAAY,EAAK;EAC5C,IAAQC,aAAa,GAAKD,KAAK,CAAvBC,aAAa;EACrB,IAAMC,QAAQ,GAAGC,QAAQ,CAACF,aAAa,CAAC;;EAExC,OAAO,CAAIC,QAAQ,SAASA,QAAQ,QAAK;AAC3C,CAAC;;AAEM,IAAME,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAACC,CAAQ,EAAE;QACb,IAAAC,oBAAA,GAAoCX,mBAAmB,CAACU,CAAC,CAAC,CAAnDE,UAAU,GAAAD,oBAAA,IAAEE,aAAa,GAAAF,oBAAA;QAChC,OAAOJ,OAAO,CAACO,GAAG,CAAAlB,eAAA,KAAAA,eAAA,OAAAmB,4BAAA,CAAAC,OAAA;QACFN,CAAC,CAACO,OAAO;QACNP,CAAC,CAACQ,iBAAiB;QAC1BR,CAAC,CAACS,WAAW;QACdT,CAAC,CAACU,UAAU;;QAERV,CAAC,CAACW,aAAa;QACbX,CAAC,CAACY,eAAe;;QAErBV,UAAU,EAAIF,CAAC,CAACa,aAAa,EAAIV,aAAa;;QAElDH,CAAC,CAACc,QAAQ;;MAErB,CAAC;;MAEDC,OAAO,WAAAA,QAACf,CAAQ,EAAE;QAChB,OAAOH,OAAO,CAACO,GAAG,CAAAjB,gBAAA,KAAAA,gBAAA,OAAAkB,4BAAA,CAAAC,OAAA;;;;;;;QAOCN,CAAC,CAACQ,iBAAiB;;MAExC,CAAC;;MAEDQ,YAAY,WAAAA,aAAChB,CAAQ,EAAE;QACrB,IAAAiB,qBAAA,GAAoC3B,mBAAmB,CAACU,CAAC,CAAC,CAAnDE,UAAU,GAAAe,qBAAA,IAAEd,aAAa,GAAAc,qBAAA;QAChC,OAAOpB,OAAO,CAACO,GAAG,CAAAhB,gBAAA,KAAAA,gBAAA,OAAAiB,4BAAA,CAAAC,OAAA;;QAELJ,UAAU,EAAKF,CAAC,CAACa,aAAa,EAAKV,aAAa,EAAKH,CAAC,CAACkB,iBAAiB;;MAEvF,CAAC;;MAEDC,IAAI,WAAAA,KAACnB,CAAQ,EAAE;QACb,IAAAoB,qBAAA,GAAoC9B,mBAAmB,CAACU,CAAC,CAAC,CAAnDE,UAAU,GAAAkB,qBAAA,IAAEjB,aAAa,GAAAiB,qBAAA;QAChC,IAAMC,OAAO,GAAMnB,UAAU,SAAIF,CAAC,CAACsB,gBAAkB;;QAErD,OAAOzB,OAAO,CAACO,GAAG,CAAAf,gBAAA,KAAAA,gBAAA,OAAAgB,4BAAA,CAAAC,OAAA;;;QAGPN,CAAC,CAACuB,cAAc;;;;;;QAMdrB,UAAU,EAAIF,CAAC,CAACa,aAAa,EAAKV,aAAa,EAAIH,CAAC,CAACa,aAAa;;QAElEQ,OAAO;QACOrB,CAAC,CAACwB,kBAAkB,EAAIxB,CAAC,CAACyB,wBAAwB;;QAE3DzB,CAAC,CAAC0B,gBAAgB;QACb1B,CAAC,CAAC2B,4BAA4B;;;;QAInC3B,CAAC,CAAC4B,iBAAiB;;;MAGvC;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","getVerticalPaddings","theme","toastPaddingY","paddingY","parseInt","styles","exports","memoizeStyle","root","t","_getVerticalPaddings","paddingTop","paddingBottom","css","_taggedTemplateLiteralLoose2","default","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","_getVerticalPaddings2","link","_getVerticalPaddings3","padding","toastLinkPadding","toastLinkColor","transitionDuration","transitionTimingFunction","toastLinkBgHover","toastLinkTextDecorationHover","toastLinkBgActive"],"sources":["ToastView.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst getVerticalPaddings = (theme: Theme) => {\n  const { toastPaddingY } = theme;\n  const paddingY = parseInt(toastPaddingY);\n\n  return [`${paddingY}px`, `${paddingY}px`];\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddings(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] = getVerticalPaddings(t);\n    return css`\n      display: flex;\n      margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} 0;\n    `;\n  },\n\n  link(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n    const padding = `${paddingTop} ${t.toastLinkPadding}`;\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} 0 -${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"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAG9D,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIC,KAAY,EAAK;EAC5C,IAAQC,aAAa,GAAKD,KAAK,CAAvBC,aAAa;EACrB,IAAMC,QAAQ,GAAGC,QAAQ,CAACF,aAAa,CAAC;;EAExC,OAAO,CAAIC,QAAQ,SAASA,QAAQ,QAAK;AAC3C,CAAC;;AAEM,IAAME,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAACC,CAAQ,EAAE;IACb,IAAAC,oBAAA,GAAoCV,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAD,oBAAA,IAAEE,aAAa,GAAAF,oBAAA;IAChC,WAAOG,YAAG,EAAAjB,eAAA,KAAAA,eAAA,OAAAkB,4BAAA,CAAAC,OAAA;IACMN,CAAC,CAACO,OAAO;IACNP,CAAC,CAACQ,iBAAiB;IAC1BR,CAAC,CAACS,WAAW;IACdT,CAAC,CAACU,UAAU;;IAERV,CAAC,CAACW,aAAa;IACbX,CAAC,CAACY,eAAe;;IAErBV,UAAU,EAAIF,CAAC,CAACa,aAAa,EAAIV,aAAa;;IAElDH,CAAC,CAACc,QAAQ;;EAErB,CAAC;;EAEDC,OAAO,WAAAA,QAACf,CAAQ,EAAE;IAChB,WAAOI,YAAG,EAAAhB,gBAAA,KAAAA,gBAAA,OAAAiB,4BAAA,CAAAC,OAAA;;;;;;;IAOSN,CAAC,CAACQ,iBAAiB;;EAExC,CAAC;;EAEDQ,YAAY,WAAAA,aAAChB,CAAQ,EAAE;IACrB,IAAAiB,qBAAA,GAAoC1B,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAe,qBAAA,IAAEd,aAAa,GAAAc,qBAAA;IAChC,WAAOb,YAAG,EAAAf,gBAAA,KAAAA,gBAAA,OAAAgB,4BAAA,CAAAC,OAAA;;IAEGJ,UAAU,EAAKF,CAAC,CAACa,aAAa,EAAKV,aAAa;;EAE/D,CAAC;;EAEDe,IAAI,WAAAA,KAAClB,CAAQ,EAAE;IACb,IAAAmB,qBAAA,GAAoC5B,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAiB,qBAAA,IAAEhB,aAAa,GAAAgB,qBAAA;IAChC,IAAMC,OAAO,GAAMlB,UAAU,SAAIF,CAAC,CAACqB,gBAAkB;;IAErD,WAAOjB,YAAG,EAAAd,gBAAA,KAAAA,gBAAA,OAAAe,4BAAA,CAAAC,OAAA;;;IAGCN,CAAC,CAACsB,cAAc;;;;;;IAMdpB,UAAU,EAAOC,aAAa,EAAIH,CAAC,CAACa,aAAa;;IAEjDO,OAAO;IACOpB,CAAC,CAACuB,kBAAkB,EAAIvB,CAAC,CAACwB,wBAAwB;;IAE3DxB,CAAC,CAACyB,gBAAgB;IACbzB,CAAC,CAAC0B,4BAA4B;;;;IAInC1B,CAAC,CAAC2B,iBAAiB;;;EAGvC;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/components/Toast/__creevey__/Toast.creevey.mts

@@ -0,0 +1,77 @@
+import { story, kind, test } from 'creevey';
+
+import { delay } from '../../../lib/delay';
+
+const kindTests = () => {
+  test('toastShown', async (context) => {
+    const showToast = context.webdriver.findElement({ css: '[data-tid~="show-toast"]' });
+    await context.webdriver.actions({ bridge: true }).click(showToast).move({ x: 0, y: 0 }).click().perform();
+    await delay(1000);
+    await context.matchImage(await context.takeScreenshot());
+  });
+};
+
+kind('Toast', () => {
+  story('SimpleNotification', () => {
+    kindTests();
+  });
+
+  story('TestNotifier', () => {
+    kindTests();
+  });
+
+  story('ComplexNotification', () => {
+    kindTests();
+  });
+
+  story('complex', () => {
+    kindTests();
+  });
+
+  story('StaticMethod', () => {
+    kindTests();
+  });
+
+  story('button', () => {
+    kindTests();
+  });
+
+  story('data-tid', () => {
+    kindTests();
+  });
+
+  story('onClick', () => {
+    kindTests();
+  });
+
+  story('Toast', () => {
+    kindTests();
+  });
+
+  story('push', () => {
+    kindTests();
+  });
+
+  story('ToastWithCross', () => {
+    test('idle', async (context) => {
+      const showStaticToastButton = context.webdriver.findElement({ css: '[data-tid="show-static-toast"]' });
+      const showInstanceToastButton = context.webdriver.findElement({ css: '[data-tid="show-instance-toast"]' });
+
+      await context.webdriver.actions({ bridge: true }).click(showStaticToastButton).perform();
+      await delay(1000);
+      const staticToast = await context.takeScreenshot();
+
+      const closeFirstToast = context.webdriver.findElement({ css: '[data-tid="ToastView__close"]' });
+      await context.webdriver
+        .actions({ bridge: true })
+        .click(closeFirstToast)
+        .pause(100)
+        .click(showInstanceToastButton)
+        .perform();
+      await delay(1000);
+      const instanceToast = await context.takeScreenshot();
+
+      await context.matchImages({ staticToast, instanceToast });
+    });
+  });
+});

package/cjs/components/Toast/__docs__/Toast.mdx

@@ -0,0 +1,28 @@
+import * as ToastStories from './Toast.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={ToastStories} />
+
+# Toast
+
+[Компонент в Контур.Гайдах](https://guides.kontur.ru/components/popup-elements/toast/)
+
+[Компонент в Figma](https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A5203)
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/cjs/components/Toggle/Toggle.d.ts

@@ -1,70 +1,42 @@
-import React, { AriaAttributes } from 'react';
+import React, { AriaAttributes, InputHTMLAttributes } from 'react';
 import PropTypes from 'prop-types';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { SizeProp } from '../../lib/types/props';
-export interface ToggleProps extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, CommonProps {
+export interface ToggleProps extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, Pick<InputHTMLAttributes<HTMLInputElement>, 'id' | 'name'>, CommonProps {
+    /** @ignore */
     children?: React.ReactNode;
-    /**
-     * Положение `children` относительно переключателя.
-     * @default 'right'
-     */
+    /** Задает положение `children` относительно переключателя.
+     * @default 'right' */
     captionPosition?: 'left' | 'right';
-    /**
-     * Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.
-     * @default false
-     */
+    /** Включает тогл.
+     * @default false */
     checked?: boolean;
-    /**
-     * Делает `тогл` включенным по умолчанию.
-     */
+    /** Делает `тогл` включенным по умолчанию. Не работает при заданном пропе `checked`. */
     defaultChecked?: boolean;
-    /**
-     * Отключает `тогл`.
-     */
+    /** Делает компонент недоступным. */
     disabled?: boolean;
-    /**
-     * Событие вызывающееся, когда значение `тогла` меняется, передаёт текущее значение тогла в переданную функцию.
-     */
+    /** Задает функцию, вызывающуюся при изменении значения. */
     onValueChange?: (value: boolean) => void;
-    /**
-     * Событие вызывающееся при клике на `тогл`.
-     */
+    /** Задает функцию, которая вызывается при клике на `тогл`. */
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
-    /**
-     * Состояние валидации при предупреждении.
-     * @default false
-     */
+    /** Переводит контрол в состояние валидации "предупреждение".
+     * @default false */
     warning?: boolean;
-    /**
-     * Состояние валидации при ошибке.
-     * @default false
-     */
+    /** Переводит контрол в состояние валидации "ошибка".
+     * @default false */
     error?: boolean;
-    /**
-     * Добавляет стили для состояния `loading` и отключает `тогл`.
-     */
+    /** Переводит тогл в состояние загрузки: добавляет стили для состояния `loading` и отключает `тогл`.*/
     loading?: boolean;
-    /**
-     * Если true, выставляет фокус на `тогле` после загрузки страницы.
-     */
+    /** Переводит контрол в состояние валидации "ошибка".
+     * @default false */
     autoFocus?: boolean;
-    /** Размер */
+    /** Задает размер контрола. */
     size?: SizeProp;
-    /**
-     * Событие вызывающееся, когда `тогл` получает фокус.
-     */
+    /** Задает функцию, которая вызывается, когда `тогл` получает фокус.*/
     onFocus?: React.FocusEventHandler<HTMLInputElement>;
-    /**
-     * Событие вызывающееся, когда `тогл` теряет фокус.
-     */
+    /** Задает функцию, которая вызывается, когда `тогл` теряет фокус. */
     onBlur?: React.FocusEventHandler<HTMLInputElement>;
-    /**
-     * HTML-атрибут `id` для передачи во внутренний `<input />`.
-     */
-    id?: string;
-    /**
-     * Не показывать анимацию
-     */
+    /** Отключает анимацию. */
     disableAnimations?: boolean;
 }
 export interface ToggleState {
@@ -76,7 +48,10 @@ export declare const ToggleDataTids: {
 };
 type DefaultProps = Required<Pick<ToggleProps, 'disabled' | 'loading' | 'captionPosition' | 'disableAnimations' | 'size'>>;
 /**
- * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
+ * `Toggle` переключает состояния. Например, включает или отключает уведомления в настройках.
+ * `Toggle` представляет из себя надпись + переключатель.
+ *
+ * `Toggle` нельзя использовать для выбора элементов в списке. Например, выбрать несколько писем.
  */
 export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
     static __KONTUR_REACT_UI__: string;
@@ -93,8 +68,6 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
     static defaultProps: DefaultProps;
     private getProps;
     private theme;
-    private emotion;
-    private styles;
     private input;
     private setRootNode;
     constructor(props: ToggleProps);

package/cjs/components/Toggle/Toggle.js

@@ -1,8 +1,8 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ToggleDataTids = exports.Toggle = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-
 var _keyListener = require("../../lib/events/keyListener");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
@@ -11,7 +11,6 @@ var _createPropsGetter = require("../../lib/createPropsGetter");
 var _currentEnvironment = require("../../lib/currentEnvironment");
 
 var _FocusControlWrapper = require("../../internal/FocusControlWrapper");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _Toggle2 = require("./Toggle.styles");var _class, _Toggle;
 
@@ -63,17 +62,6 @@ var _Toggle2 = require("./Toggle.styles");var _class, _Toggle;
 
 
 
-
-
-
-
-
-
-
-
-
-
-
 
 
 
@@ -95,7 +83,10 @@ var ToggleDataTids = exports.ToggleDataTids = {
 
 
 /**
- * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
+ * `Toggle` переключает состояния. Например, включает или отключает уведомления в настройках.
+ * `Toggle` представляет из себя надпись + переключатель.
+ *
+ * `Toggle` нельзя использовать для выбора элементов в списке. Например, выбрать несколько писем.
  */var
 
 Toggle = exports.Toggle = (0, _rootNode.rootNode)(_class = (_Toggle = /*#__PURE__*/function (_React$Component) {
@@ -123,8 +114,6 @@ Toggle = exports.Toggle = (0, _rootNode.rootNode)(_class = (_Toggle = /*#__PURE_
 
 
 
-
-
 
 
 
@@ -314,11 +303,6 @@ Toggle = exports.Toggle = (0, _rootNode.rootNode)(_class = (_Toggle = /*#__PURE_
 
 
 
-
-
-
-
-
 
 
 
@@ -360,7 +344,7 @@ Toggle = exports.Toggle = (0, _rootNode.rootNode)(_class = (_Toggle = /*#__PURE_
     handleBlur = function (event) {
       _this.resetFocus();
       _this.props.onBlur == null || _this.props.onBlur(event);
-    };_this.state = { focusByTab: false, checked: props.defaultChecked };return _this;}(0, _inheritsLoose2.default)(Toggle, _React$Component);var _proto = Toggle.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoFocus) {_keyListener.keyListener.isTabPressed = true;this.focus();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _Toggle2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.getContainerSizeClassName = function getContainerSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.containerLarge(this.theme);case 'medium':return styles.containerMedium(this.theme);case 'small':default:return styles.containerSmall(this.theme);}};_proto.getHandleSizeClassName = function getHandleSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.handleLarge(this.theme);case 'medium':return styles.handleMedium(this.theme);case 'small':default:return styles.handleSmall(this.theme);}};_proto.getButtonSizeClassName = function getButtonSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.buttonLarge(this.theme);case 'medium':return styles.buttonMedium(this.theme);case 'small':default:return styles.buttonSmall(this.theme);}};_proto.getRootSizeClassName = function getRootSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.rootLarge(this.theme);case 'medium':return styles.rootMedium(this.theme);case 'small':default:return styles.rootSmall(this.theme);}};_proto.getInputSizeClassName = function getInputSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.inputLarge(this.theme);case 'medium':return styles.inputMedium(this.theme);case 'small':default:return styles.inputSmall(this.theme);}};_proto.getCaptionSizeClassName = function getCaptionSizeClassName() {var styles = this.styles;switch (this.getProps().size) {case 'large':return styles.captionLarge(this.theme);case 'medium':return styles.captionMedium(this.theme);case 'small':default:return styles.captionSmall(this.theme);}};_proto.renderMain = function renderMain() {var _this$emotion$cx, _this$emotion$cx2, _this$emotion$cx4, _this$emotion$cx5;var _this$props = this.props,children = _this$props.children,warning = _this$props.warning,error = _this$props.error,id = _this$props.id,ariaDescribedby = _this$props['aria-describedby'],ariaLabel = _this$props['aria-label'];var _this$getProps = this.getProps(),loading = _this$getProps.loading,captionPosition = _this$getProps.captionPosition,disableAnimations = _this$getProps.disableAnimations;var disabled = this.getProps().disabled || loading;var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;var styles = this.styles;var containerClassNames = this.emotion.cx(this.getContainerSizeClassName(), (_this$emotion$cx = {}, _this$emotion$cx[styles.container(this.theme)] = true, _this$emotion$cx[styles.containerDisabled(this.theme)] = !!disabled, _this$emotion$cx[_Toggle2.globalClasses.container] = true, _this$emotion$cx[_Toggle2.globalClasses.containerDisabled] = !!disabled, _this$emotion$cx[_Toggle2.globalClasses.containerLoading] = loading, _this$emotion$cx));var labelClassNames = this.emotion.cx(this.getRootSizeClassName(), (_this$emotion$cx2 = {}, _this$emotion$cx2[styles.root(this.theme)] = true, _this$emotion$cx2[styles.rootLeft()] = captionPosition === 'left', _this$emotion$cx2[styles.disabled()] = !!disabled, _this$emotion$cx2[_Toggle2.globalClasses.disabled] = !!disabled, _this$emotion$cx2[styles.disableAnimation()] = disableAnimations, _this$emotion$cx2));var caption = null;if (children) {var _this$emotion$cx3;var captionClass = this.emotion.cx(this.getCaptionSizeClassName(), (_this$emotion$cx3 = {}, _this$emotion$cx3[styles.caption(this.theme)] = true, _this$emotion$cx3[styles.captionLeft(this.theme)] = captionPosition === 'left', _this$emotion$cx3[styles.disabledCaption(this.theme)] = !!disabled, _this$emotion$cx3));caption = /*#__PURE__*/_react.default.createElement("span", { className: captionClass }, children);}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("label", { "data-tid": ToggleDataTids.root, className: labelClassNames }, /*#__PURE__*/_react.default.createElement("div", { className: this.emotion.cx(this.getButtonSizeClassName(), (_this$emotion$cx4 = {}, _this$emotion$cx4[styles.button(this.theme)] = true, _this$emotion$cx4[styles.buttonRight()] = captionPosition === 'left', _this$emotion$cx4[styles.isWarning(this.theme)] = !!warning, _this$emotion$cx4[styles.isError(this.theme)] = !!error, _this$emotion$cx4[styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _this$emotion$cx4)) }, /*#__PURE__*/_react.default.createElement(_FocusControlWrapper.FocusControlWrapper, { onBlurWhenDisabled: this.resetFocus }, /*#__PURE__*/_react.default.createElement("input", { type: "checkbox", checked: checked, onChange: this.handleChange, className: this.emotion.cx(this.getInputSizeClassName(), styles.input(this.theme)), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: this.inputRef, disabled: disabled, id: id, role: "switch", "aria-label": ariaLabel, "aria-describedby": ariaDescribedby })), /*#__PURE__*/_react.default.createElement("div", { className: containerClassNames }), /*#__PURE__*/_react.default.createElement("div", { className: this.emotion.cx(this.getHandleSizeClassName(), _Toggle2.globalClasses.handle, (_this$emotion$cx5 = {}, _this$emotion$cx5[styles.handle(this.theme)] = true, _this$emotion$cx5[styles.handleDisabled(this.theme)] = disabled, _this$emotion$cx5)) })), caption));};_proto.
+    };_this.state = { focusByTab: false, checked: props.defaultChecked };return _this;}(0, _inheritsLoose2.default)(Toggle, _React$Component);var _proto = Toggle.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoFocus) {_keyListener.keyListener.isTabPressed = true;this.focus();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.getContainerSizeClassName = function getContainerSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.containerLarge(this.theme);case 'medium':return _Toggle2.styles.containerMedium(this.theme);case 'small':default:return _Toggle2.styles.containerSmall(this.theme);}};_proto.getHandleSizeClassName = function getHandleSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.handleLarge(this.theme);case 'medium':return _Toggle2.styles.handleMedium(this.theme);case 'small':default:return _Toggle2.styles.handleSmall(this.theme);}};_proto.getButtonSizeClassName = function getButtonSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.buttonLarge(this.theme);case 'medium':return _Toggle2.styles.buttonMedium(this.theme);case 'small':default:return _Toggle2.styles.buttonSmall(this.theme);}};_proto.getRootSizeClassName = function getRootSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.rootLarge(this.theme);case 'medium':return _Toggle2.styles.rootMedium(this.theme);case 'small':default:return _Toggle2.styles.rootSmall(this.theme);}};_proto.getInputSizeClassName = function getInputSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.inputLarge(this.theme);case 'medium':return _Toggle2.styles.inputMedium(this.theme);case 'small':default:return _Toggle2.styles.inputSmall(this.theme);}};_proto.getCaptionSizeClassName = function getCaptionSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle2.styles.captionLarge(this.theme);case 'medium':return _Toggle2.styles.captionMedium(this.theme);case 'small':default:return _Toggle2.styles.captionSmall(this.theme);}};_proto.renderMain = function renderMain() {var _cx, _cx2, _cx4, _cx5;var _this$props = this.props,children = _this$props.children,warning = _this$props.warning,error = _this$props.error,id = _this$props.id,name = _this$props.name,ariaDescribedby = _this$props['aria-describedby'],ariaLabel = _this$props['aria-label'];var _this$getProps = this.getProps(),loading = _this$getProps.loading,captionPosition = _this$getProps.captionPosition,disableAnimations = _this$getProps.disableAnimations;var disabled = this.getProps().disabled || loading;var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;var containerClassNames = (0, _Emotion.cx)(this.getContainerSizeClassName(), (_cx = {}, _cx[_Toggle2.styles.container(this.theme)] = true, _cx[_Toggle2.styles.containerDisabled(this.theme)] = !!disabled, _cx[_Toggle2.globalClasses.container] = true, _cx[_Toggle2.globalClasses.containerDisabled] = !!disabled, _cx[_Toggle2.globalClasses.containerLoading] = loading, _cx));var labelClassNames = (0, _Emotion.cx)(this.getRootSizeClassName(), (_cx2 = {}, _cx2[_Toggle2.styles.root(this.theme)] = true, _cx2[_Toggle2.styles.rootLeft()] = captionPosition === 'left', _cx2[_Toggle2.styles.disabled()] = !!disabled, _cx2[_Toggle2.globalClasses.disabled] = !!disabled, _cx2[_Toggle2.styles.disableAnimation()] = disableAnimations, _cx2));var caption = null;if (children) {var _cx3;var captionClass = (0, _Emotion.cx)(this.getCaptionSizeClassName(), (_cx3 = {}, _cx3[_Toggle2.styles.caption(this.theme)] = true, _cx3[_Toggle2.styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3[_Toggle2.styles.disabledCaption(this.theme)] = !!disabled, _cx3));caption = /*#__PURE__*/_react.default.createElement("span", { className: captionClass }, children);}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("label", { "data-tid": ToggleDataTids.root, className: labelClassNames }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(this.getButtonSizeClassName(), (_cx4 = {}, _cx4[_Toggle2.styles.button(this.theme)] = true, _cx4[_Toggle2.styles.buttonRight()] = captionPosition === 'left', _cx4[_Toggle2.styles.isWarning(this.theme)] = !!warning, _cx4[_Toggle2.styles.isError(this.theme)] = !!error, _cx4[_Toggle2.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _cx4)) }, /*#__PURE__*/_react.default.createElement(_FocusControlWrapper.FocusControlWrapper, { onBlurWhenDisabled: this.resetFocus }, /*#__PURE__*/_react.default.createElement("input", { type: "checkbox", checked: checked, onChange: this.handleChange, className: (0, _Emotion.cx)(this.getInputSizeClassName(), _Toggle2.styles.input(this.theme)), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: this.inputRef, disabled: disabled, id: id, name: name, role: "switch", "aria-label": ariaLabel, "aria-describedby": ariaDescribedby })), /*#__PURE__*/_react.default.createElement("div", { className: containerClassNames }), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(this.getHandleSizeClassName(), _Toggle2.globalClasses.handle, (_cx5 = {}, _cx5[_Toggle2.styles.handle(this.theme)] = true, _cx5[_Toggle2.styles.handleDisabled(this.theme)] = disabled, _cx5)) })), caption));};_proto.
 
   isUncontrolled = function isUncontrolled() {
     return this.props.checked === undefined;