@skbkontur/react-ui 0.0.0-a18e664e8f → 0.0.0-a2ba583fb2

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

@@ -1,16 +1,17 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");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, _templateObject5;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
 
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
-var getVerticalPaddingsWithCompensation = function getVerticalPaddingsWithCompensation(theme) {var
-  toastPaddingY = theme.toastPaddingY,fontFamilyCompensationBaseline = theme.fontFamilyCompensationBaseline;
+var getVerticalPaddingsWithCompensation = function getVerticalPaddingsWithCompensation(theme) {
+  var toastPaddingY = theme.toastPaddingY,fontFamilyCompensationBaseline = theme.fontFamilyCompensationBaseline;
   var paddingY = parseInt(toastPaddingY);
   var compensation = parseInt(fontFamilyCompensationBaseline);
   return [paddingY - compensation + "px", paddingY + compensation + "px"];
 };
 
 var styles = (0, _Emotion.memoizeStyle)({
-  root: function root(t) {var _getVerticalPaddingsW =
-    getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW[0],paddingBottom = _getVerticalPaddingsW[1];
+  root: function root(t) {
+    var _getVerticalPaddingsW = getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW[0],paddingBottom = _getVerticalPaddingsW[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,
@@ -26,40 +27,51 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  wrapper: function wrapper() {
-    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    "])));
+  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);
 
   },
 
-  closeWrapper: function closeWrapper(t) {var _getVerticalPaddingsW2 =
-    getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW2[0],paddingBottom = _getVerticalPaddingsW2[1];
+  closeWrapper: function closeWrapper(t) {
+    var _getVerticalPaddingsW2 = getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW2[0],paddingBottom = _getVerticalPaddingsW2[1];
     return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      margin: -", " -", " -", " -", ";\n    "])),
 
     paddingTop, t.toastPaddingX, paddingBottom, t.toastClosePadding);
 
   },
 
-  link: function link(t) {var _getVerticalPaddingsW3 =
-    getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW3[0],paddingBottom = _getVerticalPaddingsW3[1];
+  link: function link(t) {
+    var _getVerticalPaddingsW3 = getVerticalPaddingsWithCompensation(t),paddingTop = _getVerticalPaddingsW3[0],paddingBottom = _getVerticalPaddingsW3[1];
     var marginRight = Math.round(parseInt(t.toastPaddingX) * 1.5) + "px";
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n\n      margin: -", " ", " -", " ", ";\n\n      padding: ", " 0 ", ";\n\n      &:hover {\n        text-decoration: underline;\n      }\n    "])),
+    var padding = (0, _ThemeHelpers.isTheme2022)(t) ? paddingTop + " " + paddingBottom : paddingTop + " 0 " + paddingBottom;
+
+    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: -", " ", " -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])),
+
+
     t.toastLinkColor,
 
 
 
 
+
     paddingTop, marginRight, paddingBottom, t.toastPaddingX,
 
-    paddingTop, paddingBottom);
+    padding,
+    t.transitionDuration, t.transitionTimingFunction,
+
+    t.toastLinkBgHover,
+    t.toastLinkTextDecorationHover,
 
 
 
+    t.toastLinkBgActive);
 
 
   },

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

@@ -1 +1 @@
-{"version":3,"sources":["ToastView.styles.ts"],"names":["getVerticalPaddingsWithCompensation","theme","toastPaddingY","fontFamilyCompensationBaseline","paddingY","parseInt","compensation","styles","root","t","paddingTop","paddingBottom","css","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","toastClosePadding","link","marginRight","Math","round","toastLinkColor","close","toastCloseColor","toastCloseSize","toastCloseHoverColor"],"mappings":"4QAAA,oD;;;AAGA,IAAMA,mCAAmC,GAAG,SAAtCA,mCAAsC,CAACC,KAAD,EAAkB;AACpDC,EAAAA,aADoD,GACFD,KADE,CACpDC,aADoD,CACrCC,8BADqC,GACFF,KADE,CACrCE,8BADqC;AAE5D,MAAMC,QAAQ,GAAGC,QAAQ,CAACH,aAAD,CAAzB;AACA,MAAMI,YAAY,GAAGD,QAAQ,CAACF,8BAAD,CAA7B;AACA,SAAO,CAAIC,QAAQ,GAAGE,YAAf,SAAoCF,QAAQ,GAAGE,YAA/C,QAAP;AACD,CALD;;AAOO,IAAMC,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACuBT,IAAAA,mCAAmC,CAACS,CAAD,CAD1D,CACNC,UADM,4BACMC,aADN;AAEb,eAAOC,YAAP;AACgBH,IAAAA,CAAC,CAACI,OADlB;AAEmBJ,IAAAA,CAAC,CAACK,iBAFrB;AAGYL,IAAAA,CAAC,CAACM,WAHd;AAIWN,IAAAA,CAAC,CAACO,UAJb;;AAMeP,IAAAA,CAAC,CAACQ,aANjB;AAOiBR,IAAAA,CAAC,CAACS,eAPnB;;AASaR,IAAAA,UATb,EAS2BD,CAAC,CAACU,aAT7B,EAS8CR,aAT9C;;AAWSF,IAAAA,CAAC,CAACW,QAXX;;AAaD,GAhBgC;;AAkBjCC,EAAAA,OAlBiC,qBAkBvB;AACR,eAAOT,YAAP;;;;;;;;AAQD,GA3BgC;;AA6BjCU,EAAAA,YA7BiC,wBA6BpBb,CA7BoB,EA6BV;AACeT,IAAAA,mCAAmC,CAACS,CAAD,CADlD,CACdC,UADc,6BACFC,aADE;AAErB,eAAOC,YAAP;;AAEaF,IAAAA,UAFb,EAE4BD,CAAC,CAACU,aAF9B,EAEgDR,aAFhD,EAEkEF,CAAC,CAACc,iBAFpE;;AAID,GAnCgC;;AAqCjCC,EAAAA,IArCiC,gBAqC5Bf,CArC4B,EAqClB;AACuBT,IAAAA,mCAAmC,CAACS,CAAD,CAD1D,CACNC,UADM,6BACMC,aADN;AAEb,QAAMc,WAAW,GAAMC,IAAI,CAACC,KAAL,CAAWtB,QAAQ,CAACI,CAAC,CAACU,aAAH,CAAR,GAA4B,GAAvC,CAAN,OAAjB;AACA,eAAOP,YAAP;AACWH,IAAAA,CAAC,CAACmB,cADb;;;;;AAMalB,IAAAA,UANb,EAM2Be,WAN3B,EAM2Cd,aAN3C,EAM4DF,CAAC,CAACU,aAN9D;;AAQaT,IAAAA,UARb,EAQ6BC,aAR7B;;;;;;AAcD,GAtDgC;;AAwDjCkB,EAAAA,KAxDiC,iBAwD3BpB,CAxD2B,EAwDjB;AACd,eAAOG,YAAP;;AAEWH,IAAAA,CAAC,CAACqB,eAFb;;;AAKYrB,IAAAA,CAAC,CAACsB,cALd;;AAOatB,IAAAA,CAAC,CAACc,iBAPf;;AASWd,IAAAA,CAAC,CAACsB,cATb;;;AAYatB,IAAAA,CAAC,CAACuB,oBAZf;;;AAeD,GAxEgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst getVerticalPaddingsWithCompensation = (theme: Theme) => {\n  const { toastPaddingY, fontFamilyCompensationBaseline } = theme;\n  const paddingY = parseInt(toastPaddingY);\n  const compensation = parseInt(fontFamilyCompensationBaseline);\n  return [`${paddingY - compensation}px`, `${paddingY + compensation}px`];\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      background: ${t.toastBg};\n      border-radius: ${t.toastBorderRadius};\n      border: ${t.toastBorder};\n      color: ${t.toastColor};\n      display: inline-flex;\n      font-size: ${t.toastFontSize};\n      line-height: ${t.toastLineHeight};\n      opacity: 1;\n      padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n      position: relative;\n      top: ${t.toastTop};\n    `;\n  },\n\n  wrapper() {\n    return css`\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n    `;\n  },\n\n  closeWrapper(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      display: flex;\n      margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} -${t.toastClosePadding};\n    `;\n  },\n\n  link(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    const marginRight = `${Math.round(parseInt(t.toastPaddingX) * 1.5)}px`;\n    return css`\n      color: ${t.toastLinkColor};\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n\n      margin: -${paddingTop} ${marginRight} -${paddingBottom} ${t.toastPaddingX};\n\n      padding: ${paddingTop} 0 ${paddingBottom};\n\n      &:hover {\n        text-decoration: underline;\n      }\n    `;\n  },\n\n  close(t: Theme) {\n    return css`\n      box-sizing: content-box !important; // fix \"reset.css\" problem\n      color: ${t.toastCloseColor};\n      cursor: pointer;\n      display: inline-block;\n      height: ${t.toastCloseSize};\n      line-height: 0;\n      padding: ${t.toastClosePadding};\n      text-align: center;\n      width: ${t.toastCloseSize};\n\n      &:hover {\n        color: ${t.toastCloseHoverColor};\n      }\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["ToastView.styles.ts"],"names":["getVerticalPaddingsWithCompensation","theme","toastPaddingY","fontFamilyCompensationBaseline","paddingY","parseInt","compensation","styles","root","t","paddingTop","paddingBottom","css","toastBg","toastBorderRadius","toastBorder","toastColor","toastFontSize","toastLineHeight","toastPaddingX","toastTop","wrapper","closeWrapper","toastClosePadding","link","marginRight","Math","round","padding","toastLinkColor","transitionDuration","transitionTimingFunction","toastLinkBgHover","toastLinkTextDecorationHover","toastLinkBgActive","close","toastCloseColor","toastCloseSize","toastCloseHoverColor"],"mappings":"4QAAA;;AAEA,8D;;AAEA,IAAMA,mCAAmC,GAAG,SAAtCA,mCAAsC,CAACC,KAAD,EAAkB;AAC5D,MAAQC,aAAR,GAA0DD,KAA1D,CAAQC,aAAR,CAAuBC,8BAAvB,GAA0DF,KAA1D,CAAuBE,8BAAvB;AACA,MAAMC,QAAQ,GAAGC,QAAQ,CAACH,aAAD,CAAzB;AACA,MAAMI,YAAY,GAAGD,QAAQ,CAACF,8BAAD,CAA7B;AACA,SAAO,CAAIC,QAAQ,GAAGE,YAAf,SAAoCF,QAAQ,GAAGE,YAA/C,QAAP;AACD,CALD;;AAOO,IAAMC,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,gCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,4BAAmBC,aAAnB;AACA,eAAOC,YAAP;AACgBH,IAAAA,CAAC,CAACI,OADlB;AAEmBJ,IAAAA,CAAC,CAACK,iBAFrB;AAGYL,IAAAA,CAAC,CAACM,WAHd;AAIWN,IAAAA,CAAC,CAACO,UAJb;;AAMeP,IAAAA,CAAC,CAACQ,aANjB;AAOiBR,IAAAA,CAAC,CAACS,eAPnB;;AASaR,IAAAA,UATb,EAS2BD,CAAC,CAACU,aAT7B,EAS8CR,aAT9C;;AAWSF,IAAAA,CAAC,CAACW,QAXX;;AAaD,GAhBgC;;AAkBjCC,EAAAA,OAlBiC,mBAkBzBZ,CAlByB,EAkBf;AAChB,eAAOG,YAAP;;;;;;;AAOmBH,IAAAA,CAAC,CAACK,iBAPrB;;AASD,GA5BgC;;AA8BjCQ,EAAAA,YA9BiC,wBA8BpBb,CA9BoB,EA8BV;AACrB,iCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,6BAAmBC,aAAnB;AACA,eAAOC,YAAP;;AAEaF,IAAAA,UAFb,EAE4BD,CAAC,CAACU,aAF9B,EAEgDR,aAFhD,EAEkEF,CAAC,CAACc,iBAFpE;;AAID,GApCgC;;AAsCjCC,EAAAA,IAtCiC,gBAsC5Bf,CAtC4B,EAsClB;AACb,iCAAoCT,mCAAmC,CAACS,CAAD,CAAvE,CAAOC,UAAP,6BAAmBC,aAAnB;AACA,QAAMc,WAAW,GAAMC,IAAI,CAACC,KAAL,CAAWtB,QAAQ,CAACI,CAAC,CAACU,aAAH,CAAR,GAA4B,GAAvC,CAAN,OAAjB;AACA,QAAMS,OAAO,GAAG,+BAAYnB,CAAZ,IAAoBC,UAApB,SAAkCC,aAAlC,GAAuDD,UAAvD,WAAuEC,aAAvF;;AAEA,eAAOC,YAAP;;;AAGWH,IAAAA,CAAC,CAACoB,cAHb;;;;;;AASanB,IAAAA,UATb,EAS2Be,WAT3B,EAS2Cd,aAT3C,EAS4DF,CAAC,CAACU,aAT9D;;AAWaS,IAAAA,OAXb;AAY2BnB,IAAAA,CAAC,CAACqB,kBAZ7B,EAYmDrB,CAAC,CAACsB,wBAZrD;;AAckBtB,IAAAA,CAAC,CAACuB,gBAdpB;AAeuBvB,IAAAA,CAAC,CAACwB,4BAfzB;;;;AAmBkBxB,IAAAA,CAAC,CAACyB,iBAnBpB;;;AAsBD,GAjEgC;;AAmEjCC,EAAAA,KAnEiC,iBAmE3B1B,CAnE2B,EAmEjB;AACd,eAAOG,YAAP;;AAEWH,IAAAA,CAAC,CAAC2B,eAFb;;;AAKY3B,IAAAA,CAAC,CAAC4B,cALd;;AAOa5B,IAAAA,CAAC,CAACc,iBAPf;;AASWd,IAAAA,CAAC,CAAC4B,cATb;;;AAYa5B,IAAAA,CAAC,CAAC6B,oBAZf;;;AAeD,GAnFgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nconst getVerticalPaddingsWithCompensation = (theme: Theme) => {\n  const { toastPaddingY, fontFamilyCompensationBaseline } = theme;\n  const paddingY = parseInt(toastPaddingY);\n  const compensation = parseInt(fontFamilyCompensationBaseline);\n  return [`${paddingY - compensation}px`, `${paddingY + compensation}px`];\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      background: ${t.toastBg};\n      border-radius: ${t.toastBorderRadius};\n      border: ${t.toastBorder};\n      color: ${t.toastColor};\n      display: inline-flex;\n      font-size: ${t.toastFontSize};\n      line-height: ${t.toastLineHeight};\n      opacity: 1;\n      padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n      position: relative;\n      top: ${t.toastTop};\n    `;\n  },\n\n  wrapper(t: Theme) {\n    return css`\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ${t.toastBorderRadius};\n    `;\n  },\n\n  closeWrapper(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    return css`\n      display: flex;\n      margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} -${t.toastClosePadding};\n    `;\n  },\n\n  link(t: Theme) {\n    const [paddingTop, paddingBottom] = getVerticalPaddingsWithCompensation(t);\n    const marginRight = `${Math.round(parseInt(t.toastPaddingX) * 1.5)}px`;\n    const padding = isTheme2022(t) ? `${paddingTop} ${paddingBottom}` : `${paddingTop} 0 ${paddingBottom}`;\n\n    return css`\n      border: none;\n      font: inherit;\n      color: ${t.toastLinkColor};\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -${paddingTop} ${marginRight} -${paddingBottom} ${t.toastPaddingX};\n\n      padding: ${padding};\n      transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n      &:hover {\n        background: ${t.toastLinkBgHover};\n        text-decoration: ${t.toastLinkTextDecorationHover};\n      }\n\n      &:active {\n        background: ${t.toastLinkBgActive};\n      }\n    `;\n  },\n\n  close(t: Theme) {\n    return css`\n      box-sizing: content-box !important; // fix \"reset.css\" problem\n      color: ${t.toastCloseColor};\n      cursor: pointer;\n      display: inline-block;\n      height: ${t.toastCloseSize};\n      line-height: 0;\n      padding: ${t.toastClosePadding};\n      text-align: center;\n      width: ${t.toastCloseSize};\n\n      &:hover {\n        color: ${t.toastCloseHoverColor};\n      }\n    `;\n  },\n});\n"]}

package/cjs/components/Toast/locale/index.d.ts

@@ -0,0 +1,4 @@
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
+import { ToastLocale } from './types';
+export * from './types';
+export declare const ToastLocaleHelper: LocaleHelper<ToastLocale>;

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

@@ -0,0 +1,11 @@
+"use strict";exports.__esModule = true;var _exportNames = { ToastLocaleHelper: true };exports.ToastLocaleHelper = void 0;var _LocaleHelper = require("../../../lib/locale/LocaleHelper");
+
+var _en = require("./locales/en");
+var _ru = require("./locales/ru");
+
+
+var _types = require("./types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});
+
+var ToastLocaleHelper = new _LocaleHelper.LocaleHelper({
+  ru_RU: _ru.componentsLocales,
+  en_GB: _en.componentsLocales });exports.ToastLocaleHelper = ToastLocaleHelper;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["ToastLocaleHelper","LocaleHelper","ru_RU","en_GB"],"mappings":"yHAAA;;AAEA;AACA;;;AAGA;;AAEO,IAAMA,iBAAiB,GAAG,IAAIC,0BAAJ,CAA8B;AAC7DC,EAAAA,KAAK,EAALA,qBAD6D;AAE7DC,EAAAA,KAAK,EAALA,qBAF6D,EAA9B,CAA1B,C","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\n\nimport { componentsLocales as en_GB } from './locales/en';\nimport { componentsLocales as ru_RU } from './locales/ru';\nimport { ToastLocale } from './types';\n\nexport * from './types';\n\nexport const ToastLocaleHelper = new LocaleHelper<ToastLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/cjs/components/Toast/locale/locales/en.d.ts

@@ -0,0 +1,2 @@
+import { ToastLocale } from '../types';
+export declare const componentsLocales: ToastLocale;

package/cjs/components/Toast/locale/locales/en.js

@@ -0,0 +1,4 @@
+"use strict";exports.__esModule = true;exports.componentsLocales = void 0;
+
+var componentsLocales = {
+  closeButtonAriaLabel: 'Close notification' };exports.componentsLocales = componentsLocales;

package/cjs/components/Toast/locale/locales/en.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["en.ts"],"names":["componentsLocales","closeButtonAriaLabel"],"mappings":";;AAEO,IAAMA,iBAA8B,GAAG;AAC5CC,EAAAA,oBAAoB,EAAE,oBADsB,EAAvC,C","sourcesContent":["import { ToastLocale } from '../types';\n\nexport const componentsLocales: ToastLocale = {\n  closeButtonAriaLabel: 'Close notification',\n};\n"]}

package/cjs/components/Toast/locale/locales/ru.d.ts

@@ -0,0 +1,2 @@
+import { ToastLocale } from '../types';
+export declare const componentsLocales: ToastLocale;

package/cjs/components/Toast/locale/locales/ru.js

@@ -0,0 +1,4 @@
+"use strict";exports.__esModule = true;exports.componentsLocales = void 0;
+
+var componentsLocales = {
+  closeButtonAriaLabel: 'Закрыть уведомление' };exports.componentsLocales = componentsLocales;

package/cjs/components/Toast/locale/locales/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ru.ts"],"names":["componentsLocales","closeButtonAriaLabel"],"mappings":";;AAEO,IAAMA,iBAA8B,GAAG;AAC5CC,EAAAA,oBAAoB,EAAE,qBADsB,EAAvC,C","sourcesContent":["import { ToastLocale } from '../types';\n\nexport const componentsLocales: ToastLocale = {\n  closeButtonAriaLabel: 'Закрыть уведомление',\n};\n"]}

package/cjs/components/Toast/locale/types.d.ts

@@ -0,0 +1,3 @@
+export interface ToastLocale {
+    closeButtonAriaLabel: string;
+}

package/cjs/components/Toast/locale/types.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;

package/cjs/components/Toast/locale/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

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

@@ -1,13 +1,18 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
 import PropTypes from 'prop-types';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface ToggleProps extends CommonProps {
+import { SizeProp } from '../../lib/types/props';
+/**
+ * @deprecated use SizeProp
+ */
+export declare type ToggleSize = SizeProp;
+export interface ToggleProps extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, CommonProps {
     children?: React.ReactNode;
     /**
      * Положение `children` относительно переключателя.
      * @default 'right'
      */
-    captionPosition: 'left' | 'right';
+    captionPosition?: 'left' | 'right';
     /**
      * Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.
      * @default false
@@ -30,12 +35,12 @@ export interface ToggleProps extends CommonProps {
      */
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
     /**
-     * Cостояние валидации при предупреждении.
+     * Состояние валидации при предупреждении.
      * @default false
      */
     warning?: boolean;
     /**
-     * Cостояние валидации при ошибке.
+     * Состояние валидации при ошибке.
      * @default false
      */
     error?: boolean;
@@ -47,6 +52,8 @@ export interface ToggleProps extends CommonProps {
      * Если true, выставляет фокус на `тогле` после загрузки страницы.
      */
     autoFocus?: boolean;
+    /** Размер */
+    size?: SizeProp;
     /**
      * Событие вызывающееся, когда `тогл` получает фокус.
      */
@@ -63,11 +70,19 @@ export interface ToggleProps extends CommonProps {
      * HTML-атрибут `id` для передачи во внутренний `<input />`.
      */
     id?: string;
+    /**
+     * Не показывать анимацию
+     */
+    disableAnimations?: boolean;
 }
 export interface ToggleState {
     checked?: boolean;
     focusByTab?: boolean;
 }
+export declare const ToggleDataTids: {
+    readonly root: "Toggle__root";
+};
+declare type DefaultProps = Required<Pick<ToggleProps, 'disabled' | 'loading' | 'captionPosition' | 'disableAnimations' | 'size'>>;
 /**
  * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
  */
@@ -81,15 +96,13 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
         loading: PropTypes.Requireable<boolean>;
         warning: PropTypes.Requireable<boolean>;
         onValueChange: PropTypes.Requireable<(...args: any[]) => any>;
-        color(props: ToggleProps): void;
-    };
-    static defaultProps: {
-        disabled: boolean;
-        loading: boolean;
-        captionPosition: string;
+        color: (props: ToggleProps) => void;
     };
+    static defaultProps: DefaultProps;
+    private getProps;
     private theme;
     private input;
+    private setRootNode;
     constructor(props: ToggleProps);
     componentDidMount(): void;
     /**
@@ -97,6 +110,13 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
      */
     focus: () => void;
     render(): JSX.Element;
+    private getContainerSizeClassName;
+    private getHandleSizeClassName;
+    private getButtonSizeClassName;
+    private getRootSizeClassName;
+    private getInputSizeClassName;
+    private getActiveHandleSizeClassName;
+    private getCaptionSizeClassName;
     private renderMain;
     private inputRef;
     private handleChange;
@@ -104,3 +124,4 @@ export declare class Toggle extends React.Component<ToggleProps, ToggleState> {
     private handleBlur;
     private isUncontrolled;
 }
+export {};

package/cjs/components/Toggle/Toggle.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Toggle = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");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 _warning = _interopRequireDefault(require("warning"));
 
@@ -7,8 +7,18 @@ var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _currentEnvironment = require("../../lib/currentEnvironment");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+
+
+var _Toggle = require("./Toggle.styles");var _class, _class2, _temp;
+
+
+
+
 
-var _Toggle = require("./Toggle.styles");
 
 var colorWarningShown = false;
 
@@ -75,6 +85,20 @@ var colorWarningShown = false;
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+var ToggleDataTids = {
+  root: 'Toggle__root' };exports.ToggleDataTids = ToggleDataTids;
 
 
 
@@ -84,7 +108,13 @@ var colorWarningShown = false;
 /**
  * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.
  */var
-Toggle = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Toggle, _React$Component);
+
+Toggle = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Toggle, _React$Component);
+
+
+
+
+
 
 
 
@@ -113,7 +143,7 @@ Toggle = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
 
 
   function Toggle(props) {var _this;
-    _this = _React$Component.call(this, props) || this;_this.theme = void 0;_this.input = null;_this.
+    _this = _React$Component.call(this, props) || this;_this.getProps = (0, _createPropsGetter.createPropsGetter)(Toggle.defaultProps);_this.input = null;_this.
 
 
 
@@ -214,6 +244,116 @@ Toggle = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -274,6 +414,6 @@ Toggle = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
 
     };_this.state = { focusByTab: false, checked: props.defaultChecked };return _this;}var _proto = Toggle.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoFocus) {_keyListener.keyListener.isTabPressed = true;this.focus();}} /**
    * @public
-   */;_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.renderMain = function renderMain() {var _cx, _cx2, _cx4, _cx5, _cx6;var _this$props = this.props,children = _this$props.children,captionPosition = _this$props.captionPosition,warning = _this$props.warning,error = _this$props.error,loading = _this$props.loading,color = _this$props.color,id = _this$props.id;var disabled = this.props.disabled || loading;var checked = this.isUncontrolled() ? this.state.checked : this.props.checked;var containerClassNames = (0, _Emotion.cx)(_Toggle.styles.container(this.theme), (_cx = {}, _cx[_Toggle.styles.containerDisabled(this.theme)] = !!disabled, _cx[_Toggle.globalClasses.container] = true, _cx[_Toggle.globalClasses.containerDisabled] = !!disabled, _cx[_Toggle.globalClasses.containerLoading] = loading, _cx));var labelClassNames = (0, _Emotion.cx)(_Toggle.styles.root(this.theme), (_cx2 = {}, _cx2[_Toggle.styles.rootLeft()] = captionPosition === 'left', _cx2[_Toggle.styles.disabled()] = !!disabled, _cx2[_Toggle.globalClasses.disabled] = !!disabled, _cx2));var caption = null;if (children) {var _cx3;var captionClass = (0, _Emotion.cx)(_Toggle.styles.caption(this.theme), (_cx3 = {}, _cx3[_Toggle.styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3[_Toggle.styles.disabledCaption(this.theme)] = !!disabled, _cx3));caption = /*#__PURE__*/_react.default.createElement("span", { className: captionClass }, children);}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement("label", { className: labelClassNames }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Toggle.styles.button(this.theme), (_cx4 = {}, _cx4[_Toggle.styles.isWarning(this.theme)] = !!warning, _cx4[_Toggle.styles.isError(this.theme)] = !!error, _cx4[_Toggle.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _cx4)) }, /*#__PURE__*/_react.default.createElement("input", { type: "checkbox", checked: checked, onChange: this.handleChange, className: _Toggle.styles.input(this.theme), onFocus: this.handleFocus, onBlur: this.handleBlur, ref: this.inputRef, disabled: disabled, id: id }), /*#__PURE__*/_react.default.createElement("div", { className: containerClassNames, style: checked && color && !disabled ? { backgroundColor: color, boxShadow: "inset 0 0 0 1px " + color } : undefined }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Toggle.styles.activeBackground(), _Toggle.globalClasses.background, (_cx5 = {}, _cx5[_Toggle.styles.activeBackgroundLoading(this.theme)] = loading, _cx5[_Toggle.styles.disabledBackground(this.theme)] = disabled, _cx5)), style: checked && color && !disabled ? { backgroundColor: color, boxShadow: "inset 0 0 0 1px " + color } : undefined })), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Toggle.styles.handle(this.theme), _Toggle.globalClasses.handle, (_cx6 = {}, _cx6[_Toggle.styles.handleDisabled(this.theme)] = disabled, _cx6)) })), caption));};_proto.isUncontrolled = function isUncontrolled() {
+   */;_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 _Toggle.styles.containerLarge(this.theme);case 'medium':return _Toggle.styles.containerMedium(this.theme);case 'small':default:return _Toggle.styles.containerSmall(this.theme);}};_proto.getHandleSizeClassName = function getHandleSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle.styles.handleLarge(this.theme);case 'medium':return _Toggle.styles.handleMedium(this.theme);case 'small':default:return _Toggle.styles.handleSmall(this.theme);}};_proto.getButtonSizeClassName = function getButtonSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle.styles.buttonLarge(this.theme);case 'medium':return _Toggle.styles.buttonMedium(this.theme);case 'small':default:return _Toggle.styles.buttonSmall(this.theme);}};_proto.getRootSizeClassName = function getRootSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle.styles.rootLarge(this.theme);case 'medium':return _Toggle.styles.rootMedium(this.theme);case 'small':default:return _Toggle.styles.rootSmall(this.theme);}};_proto.getInputSizeClassName = function getInputSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle.styles.inputLarge(this.theme);case 'medium':return _Toggle.styles.inputMedium(this.theme);case 'small':default:return _Toggle.styles.inputSmall(this.theme);}};_proto.getActiveHandleSizeClassName = function getActiveHandleSizeClassName() {if ((0, _ThemeHelpers.isTheme2022)(this.theme)) {return '';}switch (this.getProps().size) {case 'large':return _Toggle.styles.activeHandleLarge(this.theme);case 'medium':return _Toggle.styles.activeHandleMedium(this.theme);case 'small':default:return _Toggle.styles.activeHandleSmall(this.theme);}};_proto.getCaptionSizeClassName = function getCaptionSizeClassName() {switch (this.getProps().size) {case 'large':return _Toggle.styles.captionLarge(this.theme);case 'medium':return _Toggle.styles.captionMedium(this.theme);case 'small':default:return _Toggle.styles.captionSmall(this.theme);}};_proto.renderMain = function renderMain() {var _cx, _cx2, _cx4, _cx5, _cx6, _cx7;var _this$props = this.props,children = _this$props.children,warning = _this$props.warning,error = _this$props.error,color = _this$props.color,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 containerClassNames = (0, _Emotion.cx)(this.getContainerSizeClassName(), (_cx = {}, _cx[_Toggle.styles.container(this.theme)] = true, _cx[_Toggle.styles.containerDisabled(this.theme)] = !!disabled, _cx[_Toggle.globalClasses.container] = true, _cx[_Toggle.globalClasses.containerDisabled] = !!disabled, _cx[_Toggle.globalClasses.containerLoading] = loading, _cx));var labelClassNames = (0, _Emotion.cx)(this.getRootSizeClassName(), this.getActiveHandleSizeClassName(), (_cx2 = {}, _cx2[_Toggle.styles.root(this.theme)] = true, _cx2[_Toggle.styles.rootLeft()] = captionPosition === 'left', _cx2[_Toggle.styles.disabled()] = !!disabled, _cx2[_Toggle.globalClasses.disabled] = !!disabled, _cx2[_Toggle.styles.disableAnimation()] = disableAnimations, _cx2));var caption = null;if (children) {var _cx3;var captionClass = (0, _Emotion.cx)(this.getCaptionSizeClassName(), (_cx3 = {}, _cx3[_Toggle.styles.caption(this.theme)] = true, _cx3[_Toggle.styles.captionLeft(this.theme)] = captionPosition === 'left', _cx3[_Toggle.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[_Toggle.styles.button(this.theme)] = true, _cx4[_Toggle.styles.buttonRight()] = captionPosition === 'left', _cx4[_Toggle.styles.isWarning(this.theme)] = !!warning, _cx4[_Toggle.styles.isError(this.theme)] = !!error, _cx4[_Toggle.styles.focused(this.theme)] = !disabled && !!this.state.focusByTab, _cx4)) }, /*#__PURE__*/_react.default.createElement("input", { type: "checkbox", checked: checked, onChange: this.handleChange, className: (0, _Emotion.cx)(this.getInputSizeClassName(), (0, _ThemeHelpers.isTheme2022)(this.theme) && _Toggle.styles.input2022(this.theme), (_cx5 = {}, _cx5[_Toggle.styles.input(this.theme)] = true, _cx5)), 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, style: checked && color && !disabled ? { backgroundColor: color, boxShadow: "inset 0 0 0 1px " + color } : undefined }, !(0, _ThemeHelpers.isTheme2022)(this.theme) && /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Toggle.styles.activeBackground(), _Toggle.globalClasses.background, (_cx6 = {}, _cx6[_Toggle.styles.activeBackgroundLoading(this.theme)] = loading, _cx6[_Toggle.styles.disabledBackground(this.theme)] = disabled, _cx6)), style: checked && color && !disabled ? { backgroundColor: color, boxShadow: "inset 0 0 0 1px " + color } : undefined })), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(this.getHandleSizeClassName(), _Toggle.globalClasses.handle, (_cx7 = {}, _cx7[_Toggle.styles.handle(this.theme)] = true, _cx7[_Toggle.styles.handleDisabled(this.theme)] = disabled, _cx7)) })), caption));};_proto.isUncontrolled = function isUncontrolled() {
     return this.props.checked === undefined;
-  };return Toggle;}(_react.default.Component);exports.Toggle = Toggle;Toggle.__KONTUR_REACT_UI__ = 'Toggle';Toggle.propTypes = { checked: _propTypes.default.bool, defaultChecked: _propTypes.default.bool, disabled: _propTypes.default.bool, error: _propTypes.default.bool, loading: _propTypes.default.bool, warning: _propTypes.default.bool, onValueChange: _propTypes.default.func, color: function color(props) {if (props.color && !colorWarningShown) {(0, _warning.default)(false, "[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. ");colorWarningShown = true;}} };Toggle.defaultProps = { disabled: false, loading: false, captionPosition: 'right' };
+  };return Toggle;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Toggle', _class2.propTypes = { checked: _propTypes.default.bool, defaultChecked: _propTypes.default.bool, disabled: _propTypes.default.bool, error: _propTypes.default.bool, loading: _propTypes.default.bool, warning: _propTypes.default.bool, onValueChange: _propTypes.default.func, color: function color(props) {if (props.color && !colorWarningShown) {(0, _warning.default)(false, "[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. ");colorWarningShown = true;}} }, _class2.defaultProps = { disabled: false, loading: false, captionPosition: 'right', disableAnimations: _currentEnvironment.isTestEnv, size: 'small' }, _temp)) || _class;exports.Toggle = Toggle;

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

@@ -1 +1 @@
-{"version":3,"sources":["Toggle.tsx"],"names":["colorWarningShown","Toggle","props","theme","input","focus","keyListener","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","handleBlur","onBlur","state","defaultChecked","componentDidMount","autoFocus","render","renderMain","children","captionPosition","warning","error","loading","color","id","disabled","containerClassNames","styles","container","containerDisabled","globalClasses","containerLoading","labelClassNames","root","rootLeft","caption","captionClass","captionLeft","disabledCaption","button","isWarning","isError","focused","backgroundColor","boxShadow","undefined","activeBackground","background","activeBackgroundLoading","disabledBackground","handle","handleDisabled","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","func","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport warning from 'warning';\n\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles, globalClasses } from './Toggle.styles';\n\nlet colorWarningShown = false;\n\nexport interface ToggleProps extends CommonProps {\n  children?: React.ReactNode;\n  /**\n   * Положение `children` относительно переключателя.\n   * @default 'right'\n   */\n  captionPosition: 'left' | 'right';\n  /**\n   * Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.\n   * @default false\n   */\n  checked?: boolean;\n  /**\n   * Делает `тогл` включенным по умолчанию.\n   */\n  defaultChecked?: boolean;\n  /**\n   * Отключает `тогл`.\n   */\n  disabled?: boolean;\n  /**\n   * Событие вызывающееся, когда значение `тогла` меняется, передаёт текущее значение тогла в переданную функцию.\n   */\n  onValueChange?: (value: boolean) => void;\n  /**\n   * Событие вызывающееся при клике на `тогл`.\n   */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Cостояние валидации при предупреждении.\n   * @default false\n   */\n  warning?: boolean;\n  /**\n   * Cостояние валидации при ошибке.\n   * @default false\n   */\n  error?: boolean;\n  /**\n   * Добавляет стили для состояния `loading` и отключает `тогл`.\n   */\n  loading?: boolean;\n  /**\n   * Если true, выставляет фокус на `тогле` после загрузки страницы.\n   */\n  autoFocus?: boolean;\n  /**\n   * Событие вызывающееся, когда `тогл` получает фокус.\n   */\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * Событие вызывающееся, когда `тогл` теряет фокус.\n   */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * @deprecated используйте переменную темы `toggleBgChecked` вместо этого пропа.\n   */\n  color?: React.CSSProperties['color'];\n  /**\n   * HTML-атрибут `id` для передачи во внутренний `<input />`.\n   */\n  id?: string;\n}\n\nexport interface ToggleState {\n  checked?: boolean;\n  focusByTab?: boolean;\n}\n\n/**\n * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.\n */\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n  public static __KONTUR_REACT_UI__ = 'Toggle';\n\n  public static propTypes = {\n    checked: PropTypes.bool,\n    defaultChecked: PropTypes.bool,\n    disabled: PropTypes.bool,\n    error: PropTypes.bool,\n    loading: PropTypes.bool,\n    warning: PropTypes.bool,\n    onValueChange: PropTypes.func,\n    color(props: ToggleProps) {\n      if (props.color && !colorWarningShown) {\n        warning(false, `[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. `);\n        colorWarningShown = true;\n      }\n    },\n  };\n\n  public static defaultProps = {\n    disabled: false,\n    loading: false,\n    captionPosition: 'right',\n  };\n\n  private theme!: Theme;\n  private input: HTMLInputElement | null = null;\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 renderMain() {\n    const { children, captionPosition, warning, error, loading, color, id } = this.props;\n    const disabled = this.props.disabled || loading;\n    const checked = this.isUncontrolled() ? this.state.checked : this.props.checked;\n\n    const containerClassNames = cx(styles.container(this.theme), {\n      [styles.containerDisabled(this.theme)]: !!disabled,\n      [globalClasses.container]: true,\n      [globalClasses.containerDisabled]: !!disabled,\n      [globalClasses.containerLoading]: loading,\n    });\n\n    const labelClassNames = cx(styles.root(this.theme), {\n      [styles.rootLeft()]: captionPosition === 'left',\n      [styles.disabled()]: !!disabled,\n      [globalClasses.disabled]: !!disabled,\n    });\n\n    let caption = null;\n    if (children) {\n      const captionClass = cx(styles.caption(this.theme), {\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 {...this.props}>\n        <label className={labelClassNames}>\n          <div\n            className={cx(styles.button(this.theme), {\n              [styles.isWarning(this.theme)]: !!warning,\n              [styles.isError(this.theme)]: !!error,\n              [styles.focused(this.theme)]: !disabled && !!this.state.focusByTab,\n            })}\n          >\n            <input\n              type=\"checkbox\"\n              checked={checked}\n              onChange={this.handleChange}\n              className={styles.input(this.theme)}\n              onFocus={this.handleFocus}\n              onBlur={this.handleBlur}\n              ref={this.inputRef}\n              disabled={disabled}\n              id={id}\n            />\n            <div\n              className={containerClassNames}\n              style={\n                checked && color && !disabled\n                  ? {\n                      backgroundColor: color,\n                      boxShadow: `inset 0 0 0 1px ${color}`,\n                    }\n                  : undefined\n              }\n            >\n              <div\n                className={cx(styles.activeBackground(), globalClasses.background, {\n                  [styles.activeBackgroundLoading(this.theme)]: loading,\n                  [styles.disabledBackground(this.theme)]: disabled,\n                })}\n                style={\n                  checked && color && !disabled\n                    ? {\n                        backgroundColor: color,\n                        boxShadow: `inset 0 0 0 1px ${color}`,\n                      }\n                    : undefined\n                }\n              />\n            </div>\n            <div\n              className={cx(styles.handle(this.theme), globalClasses.handle, {\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 handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (this.props.onBlur) {\n      this.props.onBlur(event);\n    }\n    this.setState({\n      focusByTab: false,\n    });\n  };\n\n  private isUncontrolled() {\n    return this.props.checked === undefined;\n  }\n}\n"]}
+{"version":3,"sources":["Toggle.tsx"],"names":["colorWarningShown","ToggleDataTids","root","Toggle","rootNode","props","getProps","defaultProps","input","focus","keyListener","isTabPressed","inputRef","element","handleChange","event","onValueChange","target","checked","isUncontrolled","setState","onChange","handleFocus","onFocus","focusByTab","handleBlur","onBlur","state","defaultChecked","componentDidMount","autoFocus","render","theme","renderMain","getContainerSizeClassName","size","styles","containerLarge","containerMedium","containerSmall","getHandleSizeClassName","handleLarge","handleMedium","handleSmall","getButtonSizeClassName","buttonLarge","buttonMedium","buttonSmall","getRootSizeClassName","rootLarge","rootMedium","rootSmall","getInputSizeClassName","inputLarge","inputMedium","inputSmall","getActiveHandleSizeClassName","activeHandleLarge","activeHandleMedium","activeHandleSmall","getCaptionSizeClassName","captionLarge","captionMedium","captionSmall","children","warning","error","color","id","ariaDescribedby","ariaLabel","loading","captionPosition","disableAnimations","disabled","containerClassNames","container","containerDisabled","globalClasses","containerLoading","labelClassNames","rootLeft","disableAnimation","caption","captionClass","captionLeft","disabledCaption","setRootNode","button","buttonRight","isWarning","isError","focused","input2022","backgroundColor","boxShadow","undefined","activeBackground","background","activeBackgroundLoading","disabledBackground","handle","handleDisabled","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","func","isTestEnv"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport warning from 'warning';\n\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { styles, globalClasses } from './Toggle.styles';\n\n/**\n * @deprecated use SizeProp\n */\nexport type ToggleSize = SizeProp;\n\nlet colorWarningShown = false;\n\nexport interface ToggleProps extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, CommonProps {\n  children?: React.ReactNode;\n  /**\n   * Положение `children` относительно переключателя.\n   * @default 'right'\n   */\n  captionPosition?: 'left' | 'right';\n  /**\n   * Состояние `тогла`, если `true` - `тогл` будет включён, иначе выключен.\n   * @default false\n   */\n  checked?: boolean;\n  /**\n   * Делает `тогл` включенным по умолчанию.\n   */\n  defaultChecked?: boolean;\n  /**\n   * Отключает `тогл`.\n   */\n  disabled?: boolean;\n  /**\n   * Событие вызывающееся, когда значение `тогла` меняется, передаёт текущее значение тогла в переданную функцию.\n   */\n  onValueChange?: (value: boolean) => void;\n  /**\n   * Событие вызывающееся при клике на `тогл`.\n   */\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  /**\n   * Состояние валидации при предупреждении.\n   * @default false\n   */\n  warning?: boolean;\n  /**\n   * Состояние валидации при ошибке.\n   * @default false\n   */\n  error?: boolean;\n  /**\n   * Добавляет стили для состояния `loading` и отключает `тогл`.\n   */\n  loading?: boolean;\n  /**\n   * Если true, выставляет фокус на `тогле` после загрузки страницы.\n   */\n  autoFocus?: boolean;\n  /** Размер */\n  size?: SizeProp;\n  /**\n   * Событие вызывающееся, когда `тогл` получает фокус.\n   */\n  onFocus?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * Событие вызывающееся, когда `тогл` теряет фокус.\n   */\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  /**\n   * @deprecated используйте переменную темы `toggleBgChecked` вместо этого пропа.\n   */\n  color?: React.CSSProperties['color'];\n  /**\n   * HTML-атрибут `id` для передачи во внутренний `<input />`.\n   */\n  id?: string;\n  /**\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<\n  Pick<ToggleProps, 'disabled' | 'loading' | 'captionPosition' | 'disableAnimations' | 'size'>\n>;\n\n/**\n * _Примечание:_ под тоглом понимается полный компонент т.е. надпись + переключатель, а не просто переключатель.\n */\n@rootNode\nexport class Toggle extends React.Component<ToggleProps, ToggleState> {\n  public static __KONTUR_REACT_UI__ = 'Toggle';\n\n  public static propTypes = {\n    checked: PropTypes.bool,\n    defaultChecked: PropTypes.bool,\n    disabled: PropTypes.bool,\n    error: PropTypes.bool,\n    loading: PropTypes.bool,\n    warning: PropTypes.bool,\n    onValueChange: PropTypes.func,\n    color: (props: ToggleProps) => {\n      if (props.color && !colorWarningShown) {\n        warning(false, `[Toggle]: prop 'color' is deprecated. Please, use theme variable 'toggleBgChecked' instead. `);\n        colorWarningShown = true;\n      }\n    },\n  };\n\n  public static defaultProps: DefaultProps = {\n    disabled: false,\n    loading: false,\n    captionPosition: 'right',\n    disableAnimations: isTestEnv,\n    size: 'small',\n  };\n\n  private getProps = createPropsGetter(Toggle.defaultProps);\n\n  private theme!: Theme;\n  private input: HTMLInputElement | null = null;\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.getProps().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.getProps().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.getProps().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.getProps().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.getProps().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 getActiveHandleSizeClassName() {\n    if (isTheme2022(this.theme)) {\n      return '';\n    }\n    switch (this.getProps().size) {\n      case 'large':\n        return styles.activeHandleLarge(this.theme);\n      case 'medium':\n        return styles.activeHandleMedium(this.theme);\n      case 'small':\n      default:\n        return styles.activeHandleSmall(this.theme);\n    }\n  }\n\n  private getCaptionSizeClassName() {\n    switch (this.getProps().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      color,\n      id,\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(), this.getActiveHandleSizeClassName(), {\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            <input\n              type=\"checkbox\"\n              checked={checked}\n              onChange={this.handleChange}\n              className={cx(this.getInputSizeClassName(), isTheme2022(this.theme) && styles.input2022(this.theme), {\n                [styles.input(this.theme)]: true,\n              })}\n              onFocus={this.handleFocus}\n              onBlur={this.handleBlur}\n              ref={this.inputRef}\n              disabled={disabled}\n              id={id}\n              role=\"switch\"\n              aria-label={ariaLabel}\n              aria-describedby={ariaDescribedby}\n            />\n            <div\n              className={containerClassNames}\n              style={\n                checked && color && !disabled\n                  ? {\n                      backgroundColor: color,\n                      boxShadow: `inset 0 0 0 1px ${color}`,\n                    }\n                  : undefined\n              }\n            >\n              {!isTheme2022(this.theme) && (\n                <div\n                  className={cx(styles.activeBackground(), globalClasses.background, {\n                    [styles.activeBackgroundLoading(this.theme)]: loading,\n                    [styles.disabledBackground(this.theme)]: disabled,\n                  })}\n                  style={\n                    checked && color && !disabled\n                      ? {\n                          backgroundColor: color,\n                          boxShadow: `inset 0 0 0 1px ${color}`,\n                        }\n                      : undefined\n                  }\n                />\n              )}\n            </div>\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 handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (this.props.onBlur) {\n      this.props.onBlur(event);\n    }\n    this.setState({\n      focusByTab: false,\n    });\n  };\n\n  private isUncontrolled() {\n    return this.props.checked === undefined;\n  }\n}\n"]}

package/cjs/components/Toggle/Toggle.md

@@ -68,8 +68,25 @@ import { Gapped } from '@skbkontur/react-ui';
 </Gapped>
 ```
 
-Тогл с кастомным действием при получении и потере фокуса.
+У тоглов есть 3 стандартных размера.
+
+```jsx harmony
+import { Gapped } from '@skbkontur/react-ui';
+
+<Gapped vertical>
+  <Toggle size="small">
+    Маленький
+  </Toggle>
+  <Toggle size="medium">
+    Средний
+  </Toggle>
+  <Toggle size="large">
+    Большой
+  </Toggle>
+</Gapped>
+```
 
+Тогл с кастомным действием при получении и потере фокуса.
 
 ```jsx harmony
 import { Toast } from '@skbkontur/react-ui';
@@ -82,7 +99,6 @@ import { Toast } from '@skbkontur/react-ui';
 </Toggle>
 ```
 
-
 Тогл с кастомным действием при переключении.
 
 ```jsx harmony

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

@@ -0,0 +1,7 @@
+export declare const toggleSizeMixin: (fontSize: string, toggleHeight: string, toggleWidth: string) => string;
+export declare const buttonSizeMixin: (labGrotesqueBaselineCompensation: string, fontSize: string, toggleHeight: string, toggleWidth: string, toggleBorderRadius: string, toggleButtonOffsetY: string) => string;
+export declare const captionSizeMixin: (fontSize: string, toggleHeight: string) => string;
+export declare const handleMixin: (toggleHandleSize: string, toggleHandleBorderRadius: string) => string;
+export declare const containerSizeMixin: (toggleBorderRadius: string) => string;
+export declare const inputSizeMixin: (toggleHeight: string, toggleWidth: string) => string;
+export declare const activeHandleSizeMixin: (toggleHandleSize: string, toggleBorderWidth: string, toggleHandleActiveWidthIncrement: string, toggleWidth: string) => string;