@skbkontur/react-ui 5.6.1-9a162.0 → 6.0.0-alpha.0

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

@@ -1,44 +1,47 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+import { memoizeGetStyles } from "../../../lib/theming/Emotion";
 var getVerticalPaddings = function getVerticalPaddings(theme) {
   var toastPaddingY = theme.toastPaddingY;
   var paddingY = parseInt(toastPaddingY);
   return [paddingY + "px", paddingY + "px"];
 };
-export var styles = memoizeStyle({
-  root: function root(t) {
-    var _getVerticalPaddings = getVerticalPaddings(t),
-      paddingTop = _getVerticalPaddings[0],
-      paddingBottom = _getVerticalPaddings[1];
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n      border: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "])), t.toastBorderRadius, t.toastBorder, t.toastFontSize, t.toastLineHeight, paddingTop, t.toastPaddingX, paddingBottom, t.toastTop);
-  },
-  "default": function _default(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      color: ", ";\n    "])), t.toastBg, t.toastColor);
-  },
-  error: function error(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      color: ", ";\n    "])), t.toastErrorBg, t.toastColorError);
-  },
-  wrapper: function wrapper(t) {
-    return css(_templateObject4 || (_templateObject4 = _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 _getVerticalPaddings2 = getVerticalPaddings(t),
-      paddingTop = _getVerticalPaddings2[0],
-      paddingBottom = _getVerticalPaddings2[1];
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "])), paddingTop, t.toastPaddingX, paddingBottom);
-  },
-  link: function link(t) {
-    var _getVerticalPaddings3 = getVerticalPaddings(t),
-      paddingTop = _getVerticalPaddings3[0],
-      paddingBottom = _getVerticalPaddings3[1];
-    var padding = paddingTop + " " + t.toastLinkPadding;
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      border: none;\n      font: inherit;\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    "])), paddingTop, paddingBottom, t.toastPaddingX, padding, t.transitionDuration, t.transitionTimingFunction);
-  },
-  toastActionErrorColor: function toastActionErrorColor(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "])), t.toastLinkColorError, t.toastLinkBgHoverError, t.toastLinkTextDecorationHover, t.toastLinkBgActiveError, t.toastLinkColorActiveError);
-  },
-  toastActionDefaultColor: function toastActionDefaultColor(t) {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])), t.toastLinkColor, t.toastLinkBgHover, t.toastLinkTextDecorationHover, t.toastLinkBgActive);
-  }
+export var getStyles = memoizeGetStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    root: function root(t) {
+      var _getVerticalPaddings = getVerticalPaddings(t),
+        paddingTop = _getVerticalPaddings[0],
+        paddingBottom = _getVerticalPaddings[1];
+      return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n      border: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "])), t.toastBorderRadius, t.toastBorder, t.toastFontSize, t.toastLineHeight, paddingTop, t.toastPaddingX, paddingBottom, t.toastTop);
+    },
+    "default": function _default(t) {
+      return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      color: ", ";\n    "])), t.toastBg, t.toastColor);
+    },
+    error: function error(t) {
+      return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      color: ", ";\n    "])), t.toastErrorBg, t.toastColorError);
+    },
+    wrapper: function wrapper(t) {
+      return css(_templateObject4 || (_templateObject4 = _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 _getVerticalPaddings2 = getVerticalPaddings(t),
+        paddingTop = _getVerticalPaddings2[0],
+        paddingBottom = _getVerticalPaddings2[1];
+      return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "])), paddingTop, t.toastPaddingX, paddingBottom);
+    },
+    link: function link(t) {
+      var _getVerticalPaddings3 = getVerticalPaddings(t),
+        paddingTop = _getVerticalPaddings3[0],
+        paddingBottom = _getVerticalPaddings3[1];
+      var padding = paddingTop + " " + t.toastLinkPadding;
+      return css(_templateObject6 || (_templateObject6 = _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: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n      padding: ", ";\n      transition: background ", " ", ";\n    "])), t.toastLinkColor, paddingTop, paddingBottom, t.toastPaddingX, padding, t.transitionDuration, t.transitionTimingFunction, t.toastLinkBgHover, t.toastLinkTextDecorationHover, padding, t.transitionDuration, t.transitionTimingFunction);
+    },
+    toastActionErrorColor: function toastActionErrorColor(t) {
+      return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "])), t.toastLinkColorError, t.toastLinkBgHoverError, t.toastLinkTextDecorationHover, t.toastLinkBgActiveError, t.toastLinkColorActiveError);
+    },
+    toastActionDefaultColor: function toastActionDefaultColor(t) {
+      return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])), t.toastLinkColor, t.toastLinkBgHover, t.toastLinkTextDecorationHover, t.toastLinkBgActive);
+    }
+  };
 });

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

@@ -1 +1 @@
-{"version":3,"names":["css","memoizeStyle","getVerticalPaddings","theme","toastPaddingY","paddingY","parseInt","styles","root","t","_getVerticalPaddings","paddingTop","paddingBottom","_templateObject","_taggedTemplateLiteralLoose","toastBorderRadius","toastBorder","toastFontSize","toastLineHeight","toastPaddingX","toastTop","_default","_templateObject2","toastBg","toastColor","error","_templateObject3","toastErrorBg","toastColorError","wrapper","_templateObject4","closeWrapper","_getVerticalPaddings2","_templateObject5","link","_getVerticalPaddings3","padding","toastLinkPadding","_templateObject6","transitionDuration","transitionTimingFunction","toastActionErrorColor","_templateObject7","toastLinkColorError","toastLinkBgHoverError","toastLinkTextDecorationHover","toastLinkBgActiveError","toastLinkColorActiveError","toastActionDefaultColor","_templateObject8","toastLinkColor","toastLinkBgHover","toastLinkBgActive"],"sources":["ToastView.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { 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      border-radius: ${t.toastBorderRadius};\n      border: ${t.toastBorder};\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  default(t: Theme) {\n    return css`\n      background: ${t.toastBg};\n      color: ${t.toastColor};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      background: ${t.toastErrorBg};\n      color: ${t.toastColorError};\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      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    `;\n  },\n\n  toastActionErrorColor(t: Theme) {\n    return css`\n      color: ${t.toastLinkColorError};\n\n      &:hover {\n        background: ${t.toastLinkBgHoverError};\n        text-decoration: ${t.toastLinkTextDecorationHover};\n      }\n\n      &:active {\n        background: ${t.toastLinkBgActiveError};\n        color: ${t.toastLinkColorActiveError};\n      }\n    `;\n  },\n\n  toastActionDefaultColor(t: Theme) {\n    return css`\n      color: ${t.toastLinkColor};\n\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":"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","ignoreList":[]}
+{"version":3,"names":["memoizeGetStyles","getVerticalPaddings","theme","toastPaddingY","paddingY","parseInt","getStyles","_ref","css","root","t","_getVerticalPaddings","paddingTop","paddingBottom","_templateObject","_taggedTemplateLiteralLoose","toastBorderRadius","toastBorder","toastFontSize","toastLineHeight","toastPaddingX","toastTop","_default","_templateObject2","toastBg","toastColor","error","_templateObject3","toastErrorBg","toastColorError","wrapper","_templateObject4","closeWrapper","_getVerticalPaddings2","_templateObject5","link","_getVerticalPaddings3","padding","toastLinkPadding","_templateObject6","toastLinkColor","transitionDuration","transitionTimingFunction","toastLinkBgHover","toastLinkTextDecorationHover","toastActionErrorColor","_templateObject7","toastLinkColorError","toastLinkBgHoverError","toastLinkBgActiveError","toastLinkColorActiveError","toastActionDefaultColor","_templateObject8","toastLinkBgActive"],"sources":["ToastView.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion';\nimport type { 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 = memoizeGetStyles(({ css }: Emotion) => ({\n  root(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n    return css`\n      border-radius: ${t.toastBorderRadius};\n      border: ${t.toastBorder};\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  default(t: Theme) {\n    return css`\n      background: ${t.toastBg};\n      color: ${t.toastColor};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      background: ${t.toastErrorBg};\n      color: ${t.toastColorError};\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      padding: ${padding};\n      transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n    `;\n  },\n\n  toastActionErrorColor(t: Theme) {\n    return css`\n      color: ${t.toastLinkColorError};\n\n      &:hover {\n        background: ${t.toastLinkBgHoverError};\n        text-decoration: ${t.toastLinkTextDecorationHover};\n      }\n\n      &:active {\n        background: ${t.toastLinkBgActiveError};\n        color: ${t.toastLinkColorActiveError};\n      }\n    `;\n  },\n\n  toastActionDefaultColor(t: Theme) {\n    return css`\n      color: ${t.toastLinkColor};\n\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,SAASA,gBAAgB,QAAQ,2BAA2B;;;AAG5D,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;;AAED,OAAO,IAAME,SAAS,GAAGN,gBAAgB,CAAC,UAAAO,IAAA,OAAGC,GAAG,GAAAD,IAAA,CAAHC,GAAG,QAAiB;IAC/DC,IAAI,WAAAA,KAACC,CAAQ,EAAE;MACb,IAAAC,oBAAA,GAAoCV,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAD,oBAAA,IAAEE,aAAa,GAAAF,oBAAA;MAChC,OAAOH,GAAG,CAAAM,eAAA,KAAAA,eAAA,GAAAC,2BAAA;MACSL,CAAC,CAACM,iBAAiB;MAC1BN,CAAC,CAACO,WAAW;;MAEVP,CAAC,CAACQ,aAAa;MACbR,CAAC,CAACS,eAAe;;MAErBP,UAAU,EAAIF,CAAC,CAACU,aAAa,EAAIP,aAAa;;MAElDH,CAAC,CAACW,QAAQ;;IAErB,CAAC,sBAAAC;;IAEOZ,CAAQ,EAAE;MAChB,OAAOF,GAAG,CAAAe,gBAAA,KAAAA,gBAAA,GAAAR,2BAAA;MACML,CAAC,CAACc,OAAO;MACdd,CAAC,CAACe,UAAU;;IAEzB,CAAC;;IAEDC,KAAK,WAAAA,MAAChB,CAAQ,EAAE;MACd,OAAOF,GAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAZ,2BAAA;MACML,CAAC,CAACkB,YAAY;MACnBlB,CAAC,CAACmB,eAAe;;IAE9B,CAAC;;IAEDC,OAAO,WAAAA,QAACpB,CAAQ,EAAE;MAChB,OAAOF,GAAG,CAAAuB,gBAAA,KAAAA,gBAAA,GAAAhB,2BAAA;;;;;;;MAOSL,CAAC,CAACM,iBAAiB;;IAExC,CAAC;;IAEDgB,YAAY,WAAAA,aAACtB,CAAQ,EAAE;MACrB,IAAAuB,qBAAA,GAAoChC,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAqB,qBAAA,IAAEpB,aAAa,GAAAoB,qBAAA;MAChC,OAAOzB,GAAG,CAAA0B,gBAAA,KAAAA,gBAAA,GAAAnB,2BAAA;;MAEGH,UAAU,EAAKF,CAAC,CAACU,aAAa,EAAKP,aAAa;;IAE/D,CAAC;;IAEDsB,IAAI,WAAAA,KAACzB,CAAQ,EAAE;MACb,IAAA0B,qBAAA,GAAoCnC,mBAAmB,CAACS,CAAC,CAAC,CAAnDE,UAAU,GAAAwB,qBAAA,IAAEvB,aAAa,GAAAuB,qBAAA;MAChC,IAAMC,OAAO,GAAMzB,UAAU,SAAIF,CAAC,CAAC4B,gBAAkB;;MAErD,OAAO9B,GAAG,CAAA+B,gBAAA,KAAAA,gBAAA,GAAAxB,2BAAA;;;MAGCL,CAAC,CAAC8B,cAAc;;;;;;MAMd5B,UAAU,EAAOC,aAAa,EAAIH,CAAC,CAACU,aAAa;;MAEjDiB,OAAO;MACO3B,CAAC,CAAC+B,kBAAkB,EAAI/B,CAAC,CAACgC,wBAAwB;;MAE3DhC,CAAC,CAACiC,gBAAgB;MACbjC,CAAC,CAACkC,4BAA4B;;MAExCP,OAAO;MACO3B,CAAC,CAAC+B,kBAAkB,EAAI/B,CAAC,CAACgC,wBAAwB;;IAE/E,CAAC;;IAEDG,qBAAqB,WAAAA,sBAACnC,CAAQ,EAAE;MAC9B,OAAOF,GAAG,CAAAsC,gBAAA,KAAAA,gBAAA,GAAA/B,2BAAA;MACCL,CAAC,CAACqC,mBAAmB;;;MAGdrC,CAAC,CAACsC,qBAAqB;MAClBtC,CAAC,CAACkC,4BAA4B;;;;MAInClC,CAAC,CAACuC,sBAAsB;MAC7BvC,CAAC,CAACwC,yBAAyB;;;IAG1C,CAAC;;IAEDC,uBAAuB,WAAAA,wBAACzC,CAAQ,EAAE;MAChC,OAAOF,GAAG,CAAA4C,gBAAA,KAAAA,gBAAA,GAAArC,2BAAA;MACCL,CAAC,CAAC8B,cAAc;;;MAGT9B,CAAC,CAACiC,gBAAgB;MACbjC,CAAC,CAACkC,4BAA4B;;;;MAInClC,CAAC,CAAC2C,iBAAiB;;;IAGvC;EACF,CAAC,EAAC,CAAC","ignoreList":[]}

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

@@ -1,5 +1,5 @@
 import type { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
+export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
     root(t: Theme): string;
     default(t: Theme): string;
     error(t: Theme): string;
@@ -8,4 +8,4 @@ export declare const styles: {
     link(t: Theme): string;
     toastActionErrorColor(t: Theme): string;
     toastActionDefaultColor(t: Theme): string;
-};
+}>;

package/components/Toggle/Toggle/Toggle.js

@@ -2,16 +2,16 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _class, _Toggle;
 import React from 'react';
-import { keyListener } from "../../../lib/events/keyListener";
+import { KeyListener } from "../../../lib/events/keyListener";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { isTestEnv } from "../../../lib/currentEnvironment";
 import { FocusControlWrapper } from "../../../internal/FocusControlWrapper";
 import { withSize } from "../../../lib/size/SizeDecorator";
-import { styles, globalClasses } from "../Toggle.styles";
+import { withRenderEnvironment } from "../../../lib/renderEnvironment";
+import { getStyles, globalClasses } from "../Toggle.styles";
 export var ToggleDataTids = {
   root: 'Toggle__root'
 };
@@ -22,7 +22,7 @@ export var ToggleDataTids = {
  *
  * `Toggle` нельзя использовать для выбора элементов в списке. Например, выбрать несколько писем.
  */
-export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/function (_React$Component) {
+export var Toggle = withRenderEnvironment(_class = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/function (_React$Component) {
   function Toggle(props) {
     var _this;
     _this = _React$Component.call(this, props) || this;
@@ -34,7 +34,7 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
      */
     _this.focus = function () {
       if (_this.input) {
-        keyListener.isTabPressed = true;
+        _this.keyListener.isTabPressed = true;
         _this.input.focus();
       }
     };
@@ -58,7 +58,7 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
       if (_this.props.onFocus) {
         _this.props.onFocus(event);
       }
-      if (keyListener.isTabPressed) {
+      if (_this.keyListener.isTabPressed) {
         _this.setState({
           focusByTab: true
         });
@@ -82,13 +82,15 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
   _inheritsLoose(Toggle, _React$Component);
   var _proto = Toggle.prototype;
   _proto.componentDidMount = function componentDidMount() {
+    this.keyListener = new KeyListener(this.globalObject);
     if (this.props.autoFocus) {
-      keyListener.isTabPressed = true;
+      this.keyListener.isTabPressed = true;
       this.focus();
     }
   };
   _proto.render = function render() {
     var _this2 = this;
+    this.styles = getStyles(this.emotion);
     return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
       _this2.theme = theme;
       return _this2.renderMain();
@@ -97,71 +99,71 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
   _proto.getContainerSizeClassName = function getContainerSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.containerLarge(this.theme);
+        return this.styles.containerLarge(this.theme);
       case 'medium':
-        return styles.containerMedium(this.theme);
+        return this.styles.containerMedium(this.theme);
       case 'small':
       default:
-        return styles.containerSmall(this.theme);
+        return this.styles.containerSmall(this.theme);
     }
   };
   _proto.getHandleSizeClassName = function getHandleSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.handleLarge(this.theme);
+        return this.styles.handleLarge(this.theme);
       case 'medium':
-        return styles.handleMedium(this.theme);
+        return this.styles.handleMedium(this.theme);
       case 'small':
       default:
-        return styles.handleSmall(this.theme);
+        return this.styles.handleSmall(this.theme);
     }
   };
   _proto.getButtonSizeClassName = function getButtonSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.buttonLarge(this.theme);
+        return this.styles.buttonLarge(this.theme);
       case 'medium':
-        return styles.buttonMedium(this.theme);
+        return this.styles.buttonMedium(this.theme);
       case 'small':
       default:
-        return styles.buttonSmall(this.theme);
+        return this.styles.buttonSmall(this.theme);
     }
   };
   _proto.getRootSizeClassName = function getRootSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.rootLarge(this.theme);
+        return this.styles.rootLarge(this.theme);
       case 'medium':
-        return styles.rootMedium(this.theme);
+        return this.styles.rootMedium(this.theme);
       case 'small':
       default:
-        return styles.rootSmall(this.theme);
+        return this.styles.rootSmall(this.theme);
     }
   };
   _proto.getInputSizeClassName = function getInputSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.inputLarge(this.theme);
+        return this.styles.inputLarge(this.theme);
       case 'medium':
-        return styles.inputMedium(this.theme);
+        return this.styles.inputMedium(this.theme);
       case 'small':
       default:
-        return styles.inputSmall(this.theme);
+        return this.styles.inputSmall(this.theme);
     }
   };
   _proto.getCaptionSizeClassName = function getCaptionSizeClassName() {
     switch (this.size) {
       case 'large':
-        return styles.captionLarge(this.theme);
+        return this.styles.captionLarge(this.theme);
       case 'medium':
-        return styles.captionMedium(this.theme);
+        return this.styles.captionMedium(this.theme);
       case 'small':
       default:
-        return styles.captionSmall(this.theme);
+        return this.styles.captionSmall(this.theme);
     }
   };
   _proto.renderMain = function renderMain() {
-    var _cx, _cx2, _cx4, _cx5;
+    var _this$cx, _this$cx2, _this$cx4, _this$cx5;
     var _this$props = this.props,
       children = _this$props.children,
       warning = _this$props.warning,
@@ -176,12 +178,12 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
       disableAnimations = _this$getProps.disableAnimations;
     var disabled = this.getProps().disabled || loading;
     var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;
-    var containerClassNames = cx(this.getContainerSizeClassName(), (_cx = {}, _cx[styles.container(this.theme)] = true, _cx[styles.containerDisabled(this.theme)] = !!disabled, _cx[globalClasses.container] = true, _cx[globalClasses.containerDisabled] = !!disabled, _cx[globalClasses.containerLoading] = loading, _cx));
-    var labelClassNames = cx(this.getRootSizeClassName(), (_cx2 = {}, _cx2[styles.root(this.theme)] = true, _cx2[styles.rootLeft()] = captionPosition === 'left', _cx2[styles.disabled()] = !!disabled, _cx2[globalClasses.disabled] = !!disabled, _cx2[styles.disableAnimation()] = disableAnimations, _cx2));
+    var containerClassNames = this.cx(this.getContainerSizeClassName(), (_this$cx = {}, _this$cx[this.styles.container(this.theme)] = true, _this$cx[this.styles.containerDisabled(this.theme)] = !!disabled, _this$cx[globalClasses.container] = true, _this$cx[globalClasses.containerDisabled] = !!disabled, _this$cx[globalClasses.containerLoading] = loading, _this$cx));
+    var labelClassNames = this.cx(this.getRootSizeClassName(), (_this$cx2 = {}, _this$cx2[this.styles.root(this.theme)] = true, _this$cx2[this.styles.rootLeft()] = captionPosition === 'left', _this$cx2[this.styles.disabled()] = !!disabled, _this$cx2[globalClasses.disabled] = !!disabled, _this$cx2[this.styles.disableAnimation()] = disableAnimations, _this$cx2));
     var caption = null;
     if (children) {
-      var _cx3;
-      var captionClass = cx(this.getCaptionSizeClassName(), (_cx3 = {}, _cx3[styles.caption(this.theme)] = true, _cx3[styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3[styles.disabledCaption(this.theme)] = !!disabled, _cx3));
+      var _this$cx3;
+      var captionClass = this.cx(this.getCaptionSizeClassName(), (_this$cx3 = {}, _this$cx3[this.styles.caption(this.theme)] = true, _this$cx3[this.styles.captionLeft(this.theme)] = captionPosition === 'left', _this$cx3[this.styles.disabledCaption(this.theme)] = !!disabled, _this$cx3));
       caption = /*#__PURE__*/React.createElement("span", {
         className: captionClass
       }, children);
@@ -192,14 +194,14 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
       "data-tid": ToggleDataTids.root,
       className: labelClassNames
     }, /*#__PURE__*/React.createElement("div", {
-      className: cx(this.getButtonSizeClassName(), (_cx4 = {}, _cx4[styles.button(this.theme)] = true, _cx4[styles.buttonRight()] = captionPosition === 'left', _cx4[styles.isWarning(this.theme)] = !!warning, _cx4[styles.isError(this.theme)] = !!error, _cx4[styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _cx4))
+      className: this.cx(this.getButtonSizeClassName(), (_this$cx4 = {}, _this$cx4[this.styles.button(this.theme)] = true, _this$cx4[this.styles.buttonRight()] = captionPosition === 'left', _this$cx4[this.styles.isWarning(this.theme)] = !!warning, _this$cx4[this.styles.isError(this.theme)] = !!error, _this$cx4[this.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _this$cx4))
     }, /*#__PURE__*/React.createElement(FocusControlWrapper, {
       onBlurWhenDisabled: this.resetFocus
     }, /*#__PURE__*/React.createElement("input", {
       type: "checkbox",
       checked: checked,
       onChange: this.handleChange,
-      className: cx(this.getInputSizeClassName(), styles.input(this.theme)),
+      className: this.cx(this.getInputSizeClassName(), this.styles.input(this.theme)),
       onFocus: this.handleFocus,
       onBlur: this.handleBlur,
       ref: this.inputRef,
@@ -212,7 +214,7 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
     })), /*#__PURE__*/React.createElement("div", {
       className: containerClassNames
     }), /*#__PURE__*/React.createElement("div", {
-      className: cx(this.getHandleSizeClassName(), globalClasses.handle, (_cx5 = {}, _cx5[styles.handle(this.theme)] = true, _cx5[styles.handleDisabled(this.theme)] = disabled, _cx5))
+      className: this.cx(this.getHandleSizeClassName(), globalClasses.handle, (_this$cx5 = {}, _this$cx5[this.styles.handle(this.theme)] = true, _this$cx5[this.styles.handleDisabled(this.theme)] = disabled, _this$cx5))
     })), caption));
   };
   _proto.isUncontrolled = function isUncontrolled() {
@@ -224,4 +226,4 @@ export var Toggle = rootNode(_class = withSize(_class = (_Toggle = /*#__PURE__*/
   loading: false,
   captionPosition: 'right',
   disableAnimations: isTestEnv
-}, _Toggle)) || _class) || _class;
+}, _Toggle)) || _class) || _class) || _class;

package/components/Toggle/Toggle/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","keyListener","ThemeContext","CommonWrapper","cx","rootNode","createPropsGetter","isTestEnv","FocusControlWrapper","withSize","styles","globalClasses","ToggleDataTids","root","Toggle","_class","_Toggle","_React$Component","props","_this","call","getProps","defaultProps","input","focus","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","resetFocus","handleBlur","onBlur","state","defaultChecked","_inheritsLoose","_proto","prototype","componentDidMount","autoFocus","render","_this2","createElement","Consumer","theme","renderMain","getContainerSizeClassName","size","containerLarge","containerMedium","containerSmall","getHandleSizeClassName","handleLarge","handleMedium","handleSmall","getButtonSizeClassName","buttonLarge","buttonMedium","buttonSmall","getRootSizeClassName","rootLarge","rootMedium","rootSmall","getInputSizeClassName","inputLarge","inputMedium","inputSmall","getCaptionSizeClassName","captionLarge","captionMedium","captionSmall","_cx","_cx2","_cx4","_cx5","_this$props","children","warning","error","id","name","ariaDescribedby","ariaLabel","_this$getProps","loading","captionPosition","disableAnimations","disabled","containerClassNames","container","containerDisabled","containerLoading","labelClassNames","rootLeft","disableAnimation","caption","_cx3","captionClass","captionLeft","disabledCaption","className","_extends","rootNodeRef","setRootNode","button","buttonRight","isWarning","isError","focused","onBlurWhenDisabled","type","ref","role","handle","handleDisabled","undefined","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Toggle.tsx"],"sourcesContent":["import React from 'react';\nimport type { AriaAttributes, InputHTMLAttributes } from 'react';\n\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { Theme } from '../../lib/theming/Theme';\nimport type { CommonProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport type { SizeProp } from '../../lib/types/props';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper';\nimport { withSize } from '../../lib/size/SizeDecorator';\n\nimport { styles, globalClasses } from './Toggle.styles';\n\nexport interface ToggleProps\n  extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>,\n    Pick<InputHTMLAttributes<HTMLInputElement>, 'id' | 'name'>,\n    CommonProps {\n  /** @ignore */\n  children?: React.ReactNode;\n\n  /** Задает положение `children` относительно переключателя.\n   * @default 'right' */\n  captionPosition?: 'left' | 'right';\n\n  /** Включает тогл.\n   * @default false */\n  checked?: boolean;\n\n  /** Делает `тогл` включенным по умолчанию. Не работает при заданном пропе `checked`. */\n  defaultChecked?: boolean;\n\n  /** Делает компонент недоступным. */\n  disabled?: boolean;\n\n  /** Задает функцию, вызывающуюся при изменении значения. */\n  onValueChange?: (value: boolean) => void;\n\n  /** Задает функцию, которая вызывается при клике на `тогл`. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n\n  /** Переводит контрол в состояние валидации \"предупреждение\".\n   * @default false */\n  warning?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\".\n   * @default false */\n  error?: boolean;\n\n  /** Переводит тогл в состояние загрузки: добавляет стили для состояния `loading` и отключает `тогл`.*/\n  loading?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\".\n   * @default false */\n  autoFocus?: boolean;\n\n  /** Задает размер контрола. */\n  size?: SizeProp;\n\n  /** Задает функцию, которая вызывается, когда `тогл` получает фокус.*/\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n\n  /** Задает функцию, которая вызывается, когда `тогл` теряет фокус. */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n}\n\nexport interface ToggleState {\n  checked?: boolean;\n  focusByTab?: boolean;\n}\n\nexport const ToggleDataTids = {\n  root: 'Toggle__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ToggleProps, 'disabled' | 'loading' | 'captionPosition' | 'disableAnimations'>>;\n\n/**\n * `Toggle` переключает состояния. Например, включает или отключает уведомления в настройках.\n * `Toggle` представляет из себя надпись + переключатель.\n *\n * `Toggle` нельзя использовать для выбора элементов в списке. Например, выбрать несколько писем.\n */\n@rootNode\n@withSize\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n  public static __KONTUR_REACT_UI__ = 'Toggle';\n  public static displayName = 'Toggle';\n\n  public static defaultProps: DefaultProps = {\n    disabled: false,\n    loading: false,\n    captionPosition: 'right',\n    disableAnimations: isTestEnv,\n  };\n  private size!: SizeProp;\n\n  private getProps = createPropsGetter(Toggle.defaultProps);\n\n  private theme!: Theme;\n  private input: HTMLInputElement | null = null;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  constructor(props: ToggleProps) {\n    super(props);\n\n    this.state = {\n      focusByTab: false,\n      checked: props.defaultChecked,\n    };\n  }\n\n  public componentDidMount() {\n    if (this.props.autoFocus) {\n      keyListener.isTabPressed = true;\n      this.focus();\n    }\n  }\n\n  /**\n   * @public\n   */\n  public focus = () => {\n    if (this.input) {\n      keyListener.isTabPressed = true;\n      this.input.focus();\n    }\n  };\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 getContainerSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.containerLarge(this.theme);\n      case 'medium':\n        return styles.containerMedium(this.theme);\n      case 'small':\n      default:\n        return styles.containerSmall(this.theme);\n    }\n  }\n\n  private getHandleSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.handleLarge(this.theme);\n      case 'medium':\n        return styles.handleMedium(this.theme);\n      case 'small':\n      default:\n        return styles.handleSmall(this.theme);\n    }\n  }\n\n  private getButtonSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.buttonLarge(this.theme);\n      case 'medium':\n        return styles.buttonMedium(this.theme);\n      case 'small':\n      default:\n        return styles.buttonSmall(this.theme);\n    }\n  }\n\n  private getRootSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.rootLarge(this.theme);\n      case 'medium':\n        return styles.rootMedium(this.theme);\n      case 'small':\n      default:\n        return styles.rootSmall(this.theme);\n    }\n  }\n\n  private getInputSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.inputLarge(this.theme);\n      case 'medium':\n        return styles.inputMedium(this.theme);\n      case 'small':\n      default:\n        return styles.inputSmall(this.theme);\n    }\n  }\n\n  private getCaptionSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return styles.captionLarge(this.theme);\n      case 'medium':\n        return styles.captionMedium(this.theme);\n      case 'small':\n      default:\n        return styles.captionSmall(this.theme);\n    }\n  }\n\n  private renderMain() {\n    const {\n      children,\n      warning,\n      error,\n      id,\n      name,\n      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n    } = this.props;\n    const { loading, captionPosition, disableAnimations } = this.getProps();\n    const disabled = this.getProps().disabled || loading;\n    const checked = this.isUncontrolled() ? this.state.checked : this.props.checked;\n\n    const containerClassNames = cx(this.getContainerSizeClassName(), {\n      [styles.container(this.theme)]: true,\n      [styles.containerDisabled(this.theme)]: !!disabled,\n      [globalClasses.container]: true,\n      [globalClasses.containerDisabled]: !!disabled,\n      [globalClasses.containerLoading]: loading,\n    });\n\n    const labelClassNames = cx(this.getRootSizeClassName(), {\n      [styles.root(this.theme)]: true,\n      [styles.rootLeft()]: captionPosition === 'left',\n      [styles.disabled()]: !!disabled,\n      [globalClasses.disabled]: !!disabled,\n      [styles.disableAnimation()]: disableAnimations,\n    });\n\n    let caption = null;\n    if (children) {\n      const captionClass = cx(this.getCaptionSizeClassName(), {\n        [styles.caption(this.theme)]: true,\n        [styles.captionLeft(this.theme)]: captionPosition === 'left',\n        [styles.disabledCaption(this.theme)]: !!disabled,\n      });\n      caption = <span className={captionClass}>{children}</span>;\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <label data-tid={ToggleDataTids.root} className={labelClassNames}>\n          <div\n            className={cx(this.getButtonSizeClassName(), {\n              [styles.button(this.theme)]: true,\n              [styles.buttonRight()]: captionPosition === 'left',\n              [styles.isWarning(this.theme)]: !!warning,\n              [styles.isError(this.theme)]: !!error,\n              [styles.focused(this.theme)]: !disabled && !!this.state.focusByTab,\n            })}\n          >\n            <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n              <input\n                type=\"checkbox\"\n                checked={checked}\n                onChange={this.handleChange}\n                className={cx(this.getInputSizeClassName(), styles.input(this.theme))}\n                onFocus={this.handleFocus}\n                onBlur={this.handleBlur}\n                ref={this.inputRef}\n                disabled={disabled}\n                id={id}\n                name={name}\n                role=\"switch\"\n                aria-label={ariaLabel}\n                aria-describedby={ariaDescribedby}\n              />\n            </FocusControlWrapper>\n            <div className={containerClassNames} />\n            <div\n              className={cx(this.getHandleSizeClassName(), globalClasses.handle, {\n                [styles.handle(this.theme)]: true,\n                [styles.handleDisabled(this.theme)]: disabled,\n              })}\n            />\n          </div>\n          {caption}\n        </label>\n      </CommonWrapper>\n    );\n  }\n\n  private inputRef = (element: HTMLInputElement) => {\n    this.input = element;\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (this.props.onValueChange) {\n      this.props.onValueChange(event.target.checked);\n    }\n\n    if (this.isUncontrolled()) {\n      this.setState({\n        checked: event.target.checked,\n      });\n    }\n\n    if (this.props.onChange) {\n      this.props.onChange(event);\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n\n    if (keyListener.isTabPressed) {\n      this.setState({ focusByTab: true });\n    }\n  };\n\n  private resetFocus = () => this.setState({ focusByTab: false });\n\n  private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.resetFocus();\n    this.props.onBlur?.(event);\n  };\n\n  private isUncontrolled() {\n    return this.props.checked === undefined;\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","KeyListener","ThemeContext","CommonWrapper","rootNode","createPropsGetter","isTestEnv","FocusControlWrapper","withSize","withRenderEnvironment","getStyles","globalClasses","ToggleDataTids","root","Toggle","_class","_Toggle","_React$Component","props","_this","call","getProps","defaultProps","input","focus","keyListener","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","resetFocus","handleBlur","onBlur","state","defaultChecked","_inheritsLoose","_proto","prototype","componentDidMount","globalObject","autoFocus","render","_this2","styles","emotion","createElement","Consumer","theme","renderMain","getContainerSizeClassName","size","containerLarge","containerMedium","containerSmall","getHandleSizeClassName","handleLarge","handleMedium","handleSmall","getButtonSizeClassName","buttonLarge","buttonMedium","buttonSmall","getRootSizeClassName","rootLarge","rootMedium","rootSmall","getInputSizeClassName","inputLarge","inputMedium","inputSmall","getCaptionSizeClassName","captionLarge","captionMedium","captionSmall","_this$cx","_this$cx2","_this$cx4","_this$cx5","_this$props","children","warning","error","id","name","ariaDescribedby","ariaLabel","_this$getProps","loading","captionPosition","disableAnimations","disabled","containerClassNames","cx","container","containerDisabled","containerLoading","labelClassNames","rootLeft","disableAnimation","caption","_this$cx3","captionClass","captionLeft","disabledCaption","className","_extends","rootNodeRef","setRootNode","button","buttonRight","isWarning","isError","focused","onBlurWhenDisabled","type","ref","role","handle","handleDisabled","undefined","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Toggle.tsx"],"sourcesContent":["import React from 'react';\nimport type { AriaAttributes, InputHTMLAttributes } from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport type { GlobalObject } from '../../lib/globalObject';\nimport { KeyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { Theme } from '../../lib/theming/Theme';\nimport type { CommonProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport type { SizeProp } from '../../lib/types/props';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper';\nimport { withSize } from '../../lib/size/SizeDecorator';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment';\n\nimport { getStyles, globalClasses } from './Toggle.styles';\n\nexport interface ToggleProps\n  extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>,\n    Pick<InputHTMLAttributes<HTMLInputElement>, 'id' | 'name'>,\n    CommonProps {\n  /** @ignore */\n  children?: React.ReactNode;\n\n  /** Задает положение `children` относительно переключателя.\n   * @default 'right' */\n  captionPosition?: 'left' | 'right';\n\n  /** Включает тогл.\n   * @default false */\n  checked?: boolean;\n\n  /** Делает `тогл` включенным по умолчанию. Не работает при заданном пропе `checked`. */\n  defaultChecked?: boolean;\n\n  /** Делает компонент недоступным. */\n  disabled?: boolean;\n\n  /** Задает функцию, вызывающуюся при изменении значения. */\n  onValueChange?: (value: boolean) => void;\n\n  /** Задает функцию, которая вызывается при клике на `тогл`. */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n\n  /** Переводит контрол в состояние валидации \"предупреждение\".\n   * @default false */\n  warning?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\".\n   * @default false */\n  error?: boolean;\n\n  /** Переводит тогл в состояние загрузки: добавляет стили для состояния `loading` и отключает `тогл`.*/\n  loading?: boolean;\n\n  /** Переводит контрол в состояние валидации \"ошибка\".\n   * @default false */\n  autoFocus?: boolean;\n\n  /** Задает размер контрола. */\n  size?: SizeProp;\n\n  /** Задает функцию, которая вызывается, когда `тогл` получает фокус.*/\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n\n  /** Задает функцию, которая вызывается, когда `тогл` теряет фокус. */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n}\n\nexport interface ToggleState {\n  checked?: boolean;\n  focusByTab?: boolean;\n}\n\nexport const ToggleDataTids = {\n  root: 'Toggle__root',\n} as const;\n\ntype DefaultProps = Required<Pick<ToggleProps, 'disabled' | 'loading' | 'captionPosition' | 'disableAnimations'>>;\n\n/**\n * `Toggle` переключает состояния. Например, включает или отключает уведомления в настройках.\n * `Toggle` представляет из себя надпись + переключатель.\n *\n * `Toggle` нельзя использовать для выбора элементов в списке. Например, выбрать несколько писем.\n */\n@withRenderEnvironment\n@rootNode\n@withSize\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n  public static __KONTUR_REACT_UI__ = 'Toggle';\n  public static displayName = 'Toggle';\n\n  public static defaultProps: DefaultProps = {\n    disabled: false,\n    loading: false,\n    captionPosition: 'right',\n    disableAnimations: isTestEnv,\n  };\n  private size!: SizeProp;\n\n  private getProps = createPropsGetter(Toggle.defaultProps);\n\n  private styles!: ReturnType<typeof getStyles>;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private globalObject!: GlobalObject;\n  private theme!: Theme;\n  private input: HTMLInputElement | null = null;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private keyListener!: KeyListener;\n\n  constructor(props: ToggleProps) {\n    super(props);\n\n    this.state = {\n      focusByTab: false,\n      checked: props.defaultChecked,\n    };\n  }\n\n  public componentDidMount() {\n    this.keyListener = new KeyListener(this.globalObject);\n    if (this.props.autoFocus) {\n      this.keyListener.isTabPressed = true;\n      this.focus();\n    }\n  }\n\n  /**\n   * @public\n   */\n  public focus = (): void => {\n    if (this.input) {\n      this.keyListener.isTabPressed = true;\n      this.input.focus();\n    }\n  };\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private getContainerSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.containerLarge(this.theme);\n      case 'medium':\n        return this.styles.containerMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.containerSmall(this.theme);\n    }\n  }\n\n  private getHandleSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.handleLarge(this.theme);\n      case 'medium':\n        return this.styles.handleMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.handleSmall(this.theme);\n    }\n  }\n\n  private getButtonSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.buttonLarge(this.theme);\n      case 'medium':\n        return this.styles.buttonMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.buttonSmall(this.theme);\n    }\n  }\n\n  private getRootSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.rootLarge(this.theme);\n      case 'medium':\n        return this.styles.rootMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.rootSmall(this.theme);\n    }\n  }\n\n  private getInputSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.inputLarge(this.theme);\n      case 'medium':\n        return this.styles.inputMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.inputSmall(this.theme);\n    }\n  }\n\n  private getCaptionSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.captionLarge(this.theme);\n      case 'medium':\n        return this.styles.captionMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.captionSmall(this.theme);\n    }\n  }\n\n  private renderMain() {\n    const {\n      children,\n      warning,\n      error,\n      id,\n      name,\n      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n    } = this.props;\n    const { loading, captionPosition, disableAnimations } = this.getProps();\n    const disabled = this.getProps().disabled || loading;\n    const checked = this.isUncontrolled() ? this.state.checked : this.props.checked;\n\n    const containerClassNames = this.cx(this.getContainerSizeClassName(), {\n      [this.styles.container(this.theme)]: true,\n      [this.styles.containerDisabled(this.theme)]: !!disabled,\n      [globalClasses.container]: true,\n      [globalClasses.containerDisabled]: !!disabled,\n      [globalClasses.containerLoading]: loading,\n    });\n\n    const labelClassNames = this.cx(this.getRootSizeClassName(), {\n      [this.styles.root(this.theme)]: true,\n      [this.styles.rootLeft()]: captionPosition === 'left',\n      [this.styles.disabled()]: !!disabled,\n      [globalClasses.disabled]: !!disabled,\n      [this.styles.disableAnimation()]: disableAnimations,\n    });\n\n    let caption = null;\n    if (children) {\n      const captionClass = this.cx(this.getCaptionSizeClassName(), {\n        [this.styles.caption(this.theme)]: true,\n        [this.styles.captionLeft(this.theme)]: captionPosition === 'left',\n        [this.styles.disabledCaption(this.theme)]: !!disabled,\n      });\n      caption = <span className={captionClass}>{children}</span>;\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <label data-tid={ToggleDataTids.root} className={labelClassNames}>\n          <div\n            className={this.cx(this.getButtonSizeClassName(), {\n              [this.styles.button(this.theme)]: true,\n              [this.styles.buttonRight()]: captionPosition === 'left',\n              [this.styles.isWarning(this.theme)]: !!warning,\n              [this.styles.isError(this.theme)]: !!error,\n              [this.styles.focused(this.theme)]: !disabled && !!this.state.focusByTab,\n            })}\n          >\n            <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n              <input\n                type=\"checkbox\"\n                checked={checked}\n                onChange={this.handleChange}\n                className={this.cx(this.getInputSizeClassName(), this.styles.input(this.theme))}\n                onFocus={this.handleFocus}\n                onBlur={this.handleBlur}\n                ref={this.inputRef}\n                disabled={disabled}\n                id={id}\n                name={name}\n                role=\"switch\"\n                aria-label={ariaLabel}\n                aria-describedby={ariaDescribedby}\n              />\n            </FocusControlWrapper>\n            <div className={containerClassNames} />\n            <div\n              className={this.cx(this.getHandleSizeClassName(), globalClasses.handle, {\n                [this.styles.handle(this.theme)]: true,\n                [this.styles.handleDisabled(this.theme)]: disabled,\n              })}\n            />\n          </div>\n          {caption}\n        </label>\n      </CommonWrapper>\n    );\n  }\n\n  private inputRef = (element: HTMLInputElement) => {\n    this.input = element;\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (this.props.onValueChange) {\n      this.props.onValueChange(event.target.checked);\n    }\n\n    if (this.isUncontrolled()) {\n      this.setState({\n        checked: event.target.checked,\n      });\n    }\n\n    if (this.props.onChange) {\n      this.props.onChange(event);\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n\n    if (this.keyListener.isTabPressed) {\n      this.setState({ focusByTab: true });\n    }\n  };\n\n  private resetFocus = () => this.setState({ focusByTab: false });\n\n  private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.resetFocus();\n    this.props.onBlur?.(event);\n  };\n\n  private isUncontrolled() {\n    return this.props.checked === undefined;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/components/Toggle/Toggle.d.ts

@@ -60,10 +60,15 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
     static defaultProps: DefaultProps;
     private size;
     private getProps;
+    private styles;
+    private emotion;
+    private cx;
+    private globalObject;
     private theme;
     private input;
     getRootNode: TGetRootNode;
     private setRootNode;
+    private keyListener;
     constructor(props: ToggleProps);
     componentDidMount(): void;
     /**

package/components/Toggle/Toggle.mixins/Toggle.mixins.js

@@ -1,28 +1,25 @@
-import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-import { css } from "../../../lib/theming/Emotion";
 import { isChrome } from "../../../lib/client";
 import { globalClasses } from "../Toggle.styles";
 export var toggleSizeMixin = function toggleSizeMixin(fontSize, toggleHeight, toggleWidth) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    line-height: ", ";\n    font-size: ", ";\n\n    &::before {\n      width: ", ";\n    }\n  "])), toggleHeight, fontSize, toggleWidth);
+  return "\n    line-height: " + toggleHeight + ";\n    font-size: " + fontSize + ";\n\n    &::before {\n      width: " + toggleWidth + ";\n    }\n  ";
 };
 export var buttonSizeMixin = function buttonSizeMixin(labGrotesqueBaselineCompensation, fontSize, toggleHeight, toggleWidth, toggleBorderRadius, toggleButtonOffsetY) {
   var labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);
   var buttonFontSize = parseInt(fontSize);
   var baselineCompensation = buttonFontSize <= 16 && isChrome ? -labGrotesqueCompenstation : 0;
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    height: ", ";\n    width: ", ";\n    flex: 1 0 ", ";\n\n    border-radius: ", ";\n    line-height: ", ";\n\n    margin-top: calc(", " + ", "px);\n  "])), toggleHeight, toggleWidth, toggleWidth, toggleBorderRadius, toggleHeight, toggleButtonOffsetY, baselineCompensation);
+  return "\n    height: " + toggleHeight + ";\n    width: " + toggleWidth + ";\n    flex: 1 0 " + toggleWidth + ";\n\n    border-radius: " + toggleBorderRadius + ";\n    line-height: " + toggleHeight + ";\n\n    margin-top: calc(" + toggleButtonOffsetY + " + " + baselineCompensation + "px);\n  ";
 };
 export var captionSizeMixin = function captionSizeMixin(fontSize, toggleHeight) {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    line-height: ", ";\n    font-size: ", ";\n  "])), toggleHeight, fontSize);
+  return "\n    line-height: " + toggleHeight + ";\n    font-size: " + fontSize + ";\n  ";
 };
 export var handleMixin = function handleMixin(toggleHandleSize, toggleHandleBorderRadius) {
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    border-radius: ", ";\n    height: ", ";\n    width: ", ";\n  "])), toggleHandleBorderRadius, toggleHandleSize, toggleHandleSize);
+  return "\n    border-radius: " + toggleHandleBorderRadius + ";\n    height: " + toggleHandleSize + ";\n    width: " + toggleHandleSize + ";\n  ";
 };
 export var containerSizeMixin = function containerSizeMixin(toggleBorderRadius) {
-  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n    border-radius: ", ";\n  "])), toggleBorderRadius);
+  return "\n    border-radius: " + toggleBorderRadius + ";\n  ";
 };
 export var inputSizeMixin = function inputSizeMixin(toggleHeight, toggleWidth) {
   var handleWidthWithBorders = toggleHeight;
   var height = parseInt(toggleHeight);
-  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n    &:checked ~ .", " .", " {\n      border-radius: ", "px 0 0 ", "px;\n    }\n    &:checked ~ .", " {\n      transform: translateX(", ") translateX(-", ");\n    }\n  "])), globalClasses.containerDisabled, globalClasses.background, height * 0.5, height * 0.5, globalClasses.handle, toggleWidth, handleWidthWithBorders);
+  return "\n    &:checked ~ ." + globalClasses.containerDisabled + " ." + globalClasses.background + " {\n      border-radius: " + height * 0.5 + "px 0 0 " + height * 0.5 + "px;\n    }\n    &:checked ~ ." + globalClasses.handle + " {\n      transform: translateX(" + toggleWidth + ") translateX(-" + handleWidthWithBorders + ");\n    }\n  ";
 };

package/components/Toggle/Toggle.mixins/Toggle.mixins.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","isChrome","globalClasses","toggleSizeMixin","fontSize","toggleHeight","toggleWidth","_templateObject","_taggedTemplateLiteralLoose","buttonSizeMixin","labGrotesqueBaselineCompensation","toggleBorderRadius","toggleButtonOffsetY","labGrotesqueCompenstation","parseInt","buttonFontSize","baselineCompensation","_templateObject2","captionSizeMixin","_templateObject3","handleMixin","toggleHandleSize","toggleHandleBorderRadius","_templateObject4","containerSizeMixin","_templateObject5","inputSizeMixin","handleWidthWithBorders","height","_templateObject6","containerDisabled","background","handle"],"sources":["Toggle.mixins.ts"],"sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { isChrome } from '../../lib/client';\n\nimport { globalClasses } from './Toggle.styles';\n\nexport const toggleSizeMixin = (fontSize: string, toggleHeight: string, toggleWidth: string) => {\n  return css`\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n\n    &::before {\n      width: ${toggleWidth};\n    }\n  `;\n};\n\nexport const buttonSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  toggleHeight: string,\n  toggleWidth: string,\n  toggleBorderRadius: string,\n  toggleButtonOffsetY: string,\n) => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const buttonFontSize = parseInt(fontSize);\n  const baselineCompensation = buttonFontSize <= 16 && isChrome ? -labGrotesqueCompenstation : 0;\n  return css`\n    height: ${toggleHeight};\n    width: ${toggleWidth};\n    flex: 1 0 ${toggleWidth};\n\n    border-radius: ${toggleBorderRadius};\n    line-height: ${toggleHeight};\n\n    margin-top: calc(${toggleButtonOffsetY} + ${baselineCompensation}px);\n  `;\n};\n\nexport const captionSizeMixin = (fontSize: string, toggleHeight: string) => {\n  return css`\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n  `;\n};\n\nexport const handleMixin = (toggleHandleSize: string, toggleHandleBorderRadius: string) => {\n  return css`\n    border-radius: ${toggleHandleBorderRadius};\n    height: ${toggleHandleSize};\n    width: ${toggleHandleSize};\n  `;\n};\n\nexport const containerSizeMixin = (toggleBorderRadius: string) => {\n  return css`\n    border-radius: ${toggleBorderRadius};\n  `;\n};\n\nexport const inputSizeMixin = (toggleHeight: string, toggleWidth: string) => {\n  const handleWidthWithBorders = toggleHeight;\n  const height = parseInt(toggleHeight);\n  return css`\n    &:checked ~ .${globalClasses.containerDisabled} .${globalClasses.background} {\n      border-radius: ${height * 0.5}px 0 0 ${height * 0.5}px;\n    }\n    &:checked ~ .${globalClasses.handle} {\n      transform: translateX(${toggleWidth}) translateX(-${handleWidthWithBorders});\n    }\n  `;\n};\n"],"mappings":"8MAAA,SAASA,GAAG,QAAQ,2BAA2B;AAC/C,SAASC,QAAQ,QAAQ,kBAAkB;;AAE3C,SAASC,aAAa,QAAQ,iBAAiB;;AAE/C,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,QAAgB,EAAEC,YAAoB,EAAEC,WAAmB,EAAK;EAC9F,OAAON,GAAG,CAAAO,eAAA,KAAAA,eAAA,GAAAC,2BAAA;EACOH,YAAY;EACdD,QAAQ;;;EAGVE,WAAW;;;AAG1B,CAAC;;AAED,OAAO,IAAMG,eAAe,GAAG,SAAlBA,eAAeA;AAC1BC,gCAAwC;AACxCN,QAAgB;AAChBC,YAAoB;AACpBC,WAAmB;AACnBK,kBAA0B;AAC1BC,mBAA2B;AACxB;EACH,IAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAgC,CAAC;EAC5E,IAAMK,cAAc,GAAGD,QAAQ,CAACV,QAAQ,CAAC;EACzC,IAAMY,oBAAoB,GAAGD,cAAc,IAAI,EAAE,IAAId,QAAQ,GAAG,CAACY,yBAAyB,GAAG,CAAC;EAC9F,OAAOb,GAAG,CAAAiB,gBAAA,KAAAA,gBAAA,GAAAT,2BAAA;EACEH,YAAY;EACbC,WAAW;EACRA,WAAW;;EAENK,kBAAkB;EACpBN,YAAY;;EAERO,mBAAmB,EAAMI,oBAAoB;;AAEpE,CAAC;;AAED,OAAO,IAAME,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAId,QAAgB,EAAEC,YAAoB,EAAK;EAC1E,OAAOL,GAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAX,2BAAA;EACOH,YAAY;EACdD,QAAQ;;AAEzB,CAAC;;AAED,OAAO,IAAMgB,WAAW,GAAG,SAAdA,WAAWA,CAAIC,gBAAwB,EAAEC,wBAAgC,EAAK;EACzF,OAAOtB,GAAG,CAAAuB,gBAAA,KAAAA,gBAAA,GAAAf,2BAAA;EACSc,wBAAwB;EAC/BD,gBAAgB;EACjBA,gBAAgB;;AAE7B,CAAC;;AAED,OAAO,IAAMG,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIb,kBAA0B,EAAK;EAChE,OAAOX,GAAG,CAAAyB,gBAAA,KAAAA,gBAAA,GAAAjB,2BAAA;EACSG,kBAAkB;;AAEvC,CAAC;;AAED,OAAO,IAAMe,cAAc,GAAG,SAAjBA,cAAcA,CAAIrB,YAAoB,EAAEC,WAAmB,EAAK;EAC3E,IAAMqB,sBAAsB,GAAGtB,YAAY;EAC3C,IAAMuB,MAAM,GAAGd,QAAQ,CAACT,YAAY,CAAC;EACrC,OAAOL,GAAG,CAAA6B,gBAAA,KAAAA,gBAAA,GAAArB,2BAAA;EACON,aAAa,CAAC4B,iBAAiB,EAAK5B,aAAa,CAAC6B,UAAU;EACxDH,MAAM,GAAG,GAAG,EAAUA,MAAM,GAAG,GAAG;;EAEtC1B,aAAa,CAAC8B,MAAM;EACT1B,WAAW,EAAiBqB,sBAAsB;;;AAGhF,CAAC","ignoreList":[]}
+{"version":3,"names":["isChrome","globalClasses","toggleSizeMixin","fontSize","toggleHeight","toggleWidth","buttonSizeMixin","labGrotesqueBaselineCompensation","toggleBorderRadius","toggleButtonOffsetY","labGrotesqueCompenstation","parseInt","buttonFontSize","baselineCompensation","captionSizeMixin","handleMixin","toggleHandleSize","toggleHandleBorderRadius","containerSizeMixin","inputSizeMixin","handleWidthWithBorders","height","containerDisabled","background","handle"],"sources":["Toggle.mixins.ts"],"sourcesContent":["import { isChrome } from '../../lib/client';\n\nimport { globalClasses } from './Toggle.styles';\n\nexport const toggleSizeMixin = (fontSize: string, toggleHeight: string, toggleWidth: string): string => {\n  return `\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n\n    &::before {\n      width: ${toggleWidth};\n    }\n  `;\n};\n\nexport const buttonSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  toggleHeight: string,\n  toggleWidth: string,\n  toggleBorderRadius: string,\n  toggleButtonOffsetY: string,\n): string => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const buttonFontSize = parseInt(fontSize);\n  const baselineCompensation = buttonFontSize <= 16 && isChrome ? -labGrotesqueCompenstation : 0;\n  return `\n    height: ${toggleHeight};\n    width: ${toggleWidth};\n    flex: 1 0 ${toggleWidth};\n\n    border-radius: ${toggleBorderRadius};\n    line-height: ${toggleHeight};\n\n    margin-top: calc(${toggleButtonOffsetY} + ${baselineCompensation}px);\n  `;\n};\n\nexport const captionSizeMixin = (fontSize: string, toggleHeight: string): string => {\n  return `\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n  `;\n};\n\nexport const handleMixin = (toggleHandleSize: string, toggleHandleBorderRadius: string): string => {\n  return `\n    border-radius: ${toggleHandleBorderRadius};\n    height: ${toggleHandleSize};\n    width: ${toggleHandleSize};\n  `;\n};\n\nexport const containerSizeMixin = (toggleBorderRadius: string): string => {\n  return `\n    border-radius: ${toggleBorderRadius};\n  `;\n};\n\nexport const inputSizeMixin = (toggleHeight: string, toggleWidth: string): string => {\n  const handleWidthWithBorders = toggleHeight;\n  const height = parseInt(toggleHeight);\n  return `\n    &:checked ~ .${globalClasses.containerDisabled} .${globalClasses.background} {\n      border-radius: ${height * 0.5}px 0 0 ${height * 0.5}px;\n    }\n    &:checked ~ .${globalClasses.handle} {\n      transform: translateX(${toggleWidth}) translateX(-${handleWidthWithBorders});\n    }\n  `;\n};\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,kBAAkB;;AAE3C,SAASC,aAAa,QAAQ,iBAAiB;;AAE/C,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,QAAgB,EAAEC,YAAoB,EAAEC,WAAmB,EAAa;EACtG;EACiBD,YAAY;EACdD,QAAQ;;;EAGVE,WAAW;;;AAG1B,CAAC;;AAED,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAeA;AAC1BC,gCAAwC;AACxCJ,QAAgB;AAChBC,YAAoB;AACpBC,WAAmB;AACnBG,kBAA0B;AAC1BC,mBAA2B;AAChB;EACX,IAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAgC,CAAC;EAC5E,IAAMK,cAAc,GAAGD,QAAQ,CAACR,QAAQ,CAAC;EACzC,IAAMU,oBAAoB,GAAGD,cAAc,IAAI,EAAE,IAAIZ,QAAQ,GAAG,CAACU,yBAAyB,GAAG,CAAC;EAC9F;EACYN,YAAY;EACbC,WAAW;EACRA,WAAW;;EAENG,kBAAkB;EACpBJ,YAAY;;EAERK,mBAAmB,WAAMI,oBAAoB;;AAEpE,CAAC;;AAED,OAAO,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIX,QAAgB,EAAEC,YAAoB,EAAa;EAClF;EACiBA,YAAY;EACdD,QAAQ;;AAEzB,CAAC;;AAED,OAAO,IAAMY,WAAW,GAAG,SAAdA,WAAWA,CAAIC,gBAAwB,EAAEC,wBAAgC,EAAa;EACjG;EACmBA,wBAAwB;EAC/BD,gBAAgB;EACjBA,gBAAgB;;AAE7B,CAAC;;AAED,OAAO,IAAME,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIV,kBAA0B,EAAa;EACxE;EACmBA,kBAAkB;;AAEvC,CAAC;;AAED,OAAO,IAAMW,cAAc,GAAG,SAAjBA,cAAcA,CAAIf,YAAoB,EAAEC,WAAmB,EAAa;EACnF,IAAMe,sBAAsB,GAAGhB,YAAY;EAC3C,IAAMiB,MAAM,GAAGV,QAAQ,CAACP,YAAY,CAAC;EACrC;EACiBH,aAAa,CAACqB,iBAAiB,UAAKrB,aAAa,CAACsB,UAAU;EACxDF,MAAM,GAAG,GAAG,eAAUA,MAAM,GAAG,GAAG;;EAEtCpB,aAAa,CAACuB,MAAM;EACTnB,WAAW,sBAAiBe,sBAAsB;;;AAGhF,CAAC","ignoreList":[]}