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

package/cjs/components/Radio/Radio.mixins.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Radio.mixins.ts"],"names":["radioSizeMixin","fontSize","lineHeight","paddingY","radioSize","css","circleSizeMixin","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","labGrotesqueCompenstation","parseInt","radioFontSize","baselineCompensation","isChrome","isFirefox","circleSize","circleOffsetY","circleMarginX","radioCheckedMixin","bulletSize","afterOutlineMixin","radioOutlineWidth","outlineColorMixin","shadow","borderColor"],"mappings":"kYAAA;AACA;AACA,0C;;AAEO,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,QAAD,EAAmBC,UAAnB,EAAuCC,QAAvC,EAAyDC,SAAzD,EAA+E;AAC3G,aAAOC,YAAP;AACeJ,EAAAA,QADf;AAEiBC,EAAAA,UAFjB;AAGaC,EAAAA,QAHb;;AAKaC,EAAAA,SALb;;;AAQD,CATM,C;;AAWA,IAAME,eAAe,GAAG,SAAlBA,eAAkB;AAC7BC,gCAD6B;AAE7BN,QAF6B;AAG7BG,SAH6B;AAI7BI,4BAJ6B;AAK7BC,kBAL6B;AAM1B;AACH,MAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAD,CAA1C;AACA,MAAMK,aAAa,GAAGD,QAAQ,CAACV,QAAD,CAA9B;;AAEA,MAAMY,oBAAoB,GAAG;AAC3BD,EAAAA,aAD2B;AAE3BF,EAAAA,yBAF2B;AAG3BI,kBAH2B;AAI3BC,mBAJ2B,CAA7B;;AAMA,MAAMC,UAAU,aAAWZ,SAAX,eAA8BI,4BAA9B,MAAhB;AACA,MAAMS,aAAa,aAAWR,kBAAX,WAAmCD,4BAAnC,WAAqEK,oBAArE,QAAnB;AACA,MAAMK,aAAa,GAAGV,4BAAtB;AACA,aAAOH,YAAP;AACYW,EAAAA,UADZ;AAEWA,EAAAA,UAFX;AAGYC,EAAAA,aAHZ,EAG6BC,aAH7B;;AAKD,CAxBM,C;;AA0BA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,UAAD,EAAwB;AACvD,aAAOf,YAAP;;AAEce,EAAAA,UAFd;AAGaA,EAAAA,UAHb;;;AAMD,CAPM,C;;AASA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,iBAAD,EAA+B;AAC9D,aAAOjB,YAAP;;;AAGUiB,EAAAA,iBAHV;AAIaA,EAAAA,iBAJb;AAKWA,EAAAA,iBALX;AAMYA,EAAAA,iBANZ;AAOkBA,EAAAA,iBAPlB;;;;;AAYD,CAbM,C;;AAeA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,MAAD,EAAiBC,WAAjB,EAAyC;AACxE,aAAOpB,YAAP;AACgBmB,EAAAA,MADhB;AAEkBC,EAAAA,WAFlB;;AAID,CALM,C","sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { getLabGrotesqueBaselineCompensation } from '../../lib/styles/getLabGrotesqueBaselineCompensation';\nimport { isChrome, isFirefox } from '../../lib/client';\n\nexport const radioSizeMixin = (fontSize: string, lineHeight: string, paddingY: string, radioSize: string) => {\n  return css`\n    font-size: ${fontSize};\n    line-height: ${lineHeight};\n    padding: ${paddingY} 0;\n    &::before {\n      width: ${radioSize};\n    }\n  `;\n};\n\nexport const circleSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  radioSize: string,\n  radioBorderWidthCompensation: string,\n  radioCircleOffsetY: string,\n) => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const radioFontSize = parseInt(fontSize);\n\n  const baselineCompensation = getLabGrotesqueBaselineCompensation(\n    radioFontSize,\n    labGrotesqueCompenstation,\n    isChrome,\n    isFirefox,\n  );\n  const circleSize = `calc(${radioSize} - 2 * ${radioBorderWidthCompensation})`;\n  const circleOffsetY = `calc(${radioCircleOffsetY} + ${radioBorderWidthCompensation} + ${baselineCompensation}px)`;\n  const circleMarginX = radioBorderWidthCompensation;\n  return css`\n    height: ${circleSize};\n    width: ${circleSize};\n    margin: ${circleOffsetY} ${circleMarginX} 0;\n  `;\n};\n\nexport const radioCheckedMixin = (bulletSize: string) => {\n  return css`\n    &::before {\n      height: ${bulletSize};\n      width: ${bulletSize};\n    }\n  `;\n};\n\nexport const afterOutlineMixin = (radioOutlineWidth: string) => {\n  return css`\n    content: ' ';\n    position: absolute;\n    top: -${radioOutlineWidth};\n    bottom: -${radioOutlineWidth};\n    left: -${radioOutlineWidth};\n    right: -${radioOutlineWidth};\n    border-width: ${radioOutlineWidth};\n    border-style: solid;\n    border-radius: 50%;\n    box-sizing: border-box;\n  `;\n};\n\nexport const outlineColorMixin = (shadow: string, borderColor: string) => {\n  return css`\n    box-shadow: ${shadow};\n    border-color: ${borderColor};\n  `;\n};\n"]}

package/cjs/components/Radio/Radio.styles.d.ts

@@ -4,13 +4,22 @@ export declare const globalClasses: {
 };
 export declare const styles: {
     root(t: Theme): string;
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
     rootIE11(): string;
     rootChecked(t: Theme): string;
     circle(t: Theme): string;
+    circleSmall(t: Theme): string;
+    circleMedium(t: Theme): string;
+    circleLarge(t: Theme): string;
     focus(t: Theme): string;
     warning(t: Theme): string;
     error(t: Theme): string;
     checked(t: Theme): string;
+    checkedSmall(t: Theme): string;
+    checkedMedium(t: Theme): string;
+    checkedLarge(t: Theme): string;
     checkedDisabled(t: Theme): string;
     input(): string;
     disabled(t: Theme): string;

package/cjs/components/Radio/Radio.styles.js

@@ -1,40 +1,30 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = exports.globalClasses = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
 
-var _client = require("../../lib/client");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
 
-var globalClasses = (0, _Emotion.prefix)('radio')({
-  circle: 'circle' });exports.globalClasses = globalClasses;
+var _Radio = require("./Radio.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
 
 
-var mixins = {
-  afterOutline: function afterOutline(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      content: ' ';\n      position: absolute;\n      left: -", ";\n      top: -", ";\n      width: ", ";\n      height: ", ";\n      border-width: ", ";\n      border-style: solid;\n      border-radius: 50%;\n      box-sizing: border-box;\n    "])),
 
 
-    t.radioOutlineWidth,
-    t.radioOutlineWidth,
-    t.radioSizeAfter,
-    t.radioSizeAfter,
-    t.radioOutlineWidth);
 
 
 
-
-  } };
+var globalClasses = (0, _Emotion.prefix)('radio')({
+  circle: 'circle' });exports.globalClasses = globalClasses;
 
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      padding-top: ", ";\n      padding-bottom: ", ";\n      display: inline-flex;\n      align-items: baseline;\n      line-height: ", ";\n      font-size: ", ";\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\00A0';\n        display: inline-block;\n        width: ", ";\n        flex: 0 0 auto;\n      }\n    "], ["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      padding-top: ", ";\n      padding-bottom: ", ";\n      display: inline-flex;\n      align-items: baseline;\n      line-height: ", ";\n      font-size: ", ";\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        width: ", ";\n        flex: 0 0 auto;\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .", " {\n        transition: background ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    "], ["\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .", " {\n        transition: background ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    "])),
+
 
 
 
-    t.radioPaddingY,
-    t.radioPaddingY,
 
 
-    t.radioLineHeight,
-    t.radioFontSize,
+    globalClasses.circle,
+    t.transitionDuration, t.transitionTimingFunction,
+
 
     globalClasses.circle,
     t.radioHoverBg,
@@ -42,7 +32,7 @@ var styles = (0, _Emotion.memoizeStyle)({
 
     globalClasses.circle,
     t.radioActiveBg,
-    t.radioActiveShadow,
+    t.radioActiveShadow);
 
 
 
@@ -51,20 +41,34 @@ var styles = (0, _Emotion.memoizeStyle)({
 
 
 
-    t.radioSize);
 
 
 
+  },
+  rootSmall: function rootSmall(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioSizeMixin)(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall));
+
+  },
+  rootMedium: function rootMedium(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioSizeMixin)(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium));
+
+  },
+  rootLarge: function rootLarge(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioSizeMixin)(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge));
+
   },
 
   rootIE11: function rootIE11() {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-table;\n    "])));
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-table;\n    "])));
 
 
   },
 
   rootChecked: function rootChecked(t) {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover .", " {\n        background: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover .", " {\n        background: ", ";\n      }\n    "])),
     globalClasses.circle,
     t.radioCheckedHoverBgColor);
 
@@ -72,65 +76,81 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   circle: function circle(t) {
-    var labGrotesqueCompenstation = parseInt(t.labGrotesqueBaselineCompensation);
-    var fontSize = parseInt(t.checkboxFontSize);
-    var baselineCompensation =
-    fontSize < 16 && !_client.isChrome ?
-    labGrotesqueCompenstation :
-    fontSize === 16 && _client.isChrome ?
-    -labGrotesqueCompenstation :
-    0;
-    var circleSize = "calc(" + t.radioSize + " - 2 * " + t.radioBorderWidthCompensation + ")";
-    var circleOffsetY = "calc(" + t.radioCircleOffsetY + " + " + t.radioBorderWidthCompensation + " + " + baselineCompensation + "px)";
-    var circleMarginX = t.radioBorderWidthCompensation;
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-image: ", ";\n      border-radius: 50%;\n      border: ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      display: inline-block;\n      height: ", ";\n      width: ", ";\n      position: absolute;\n      left: 0;\n      margin: ", " ", " 0;\n      background-color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-image: ", ";\n      border-radius: 50%;\n      border: ", ";\n      box-shadow: ", ";\n      box-sizing: border-box;\n      display: inline-block;\n      position: absolute;\n      left: 0;\n      background-color: ", ";\n    "])),
     t.radioBgImage,
 
     t.radioBorder,
     t.radioBoxShadow,
 
 
-    circleSize,
-    circleSize,
 
 
-    circleOffsetY, circleMarginX,
     t.radioBgColor);
 
+  },
+  circleSmall: function circleSmall(t) {
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.circleSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.radioFontSizeSmall,
+    t.radioSizeSmall,
+    t.radioBorderWidthCompensation,
+    t.radioCircleOffsetY));
+
+
+  },
+  circleMedium: function circleMedium(t) {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.circleSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.radioFontSizeMedium,
+    t.radioSizeMedium,
+    t.radioBorderWidthCompensation,
+    t.radioCircleOffsetY));
+
+
+  },
+  circleLarge: function circleLarge(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.circleSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.radioFontSizeLarge,
+    t.radioSizeLarge,
+    t.radioBorderWidthCompensation,
+    t.radioCircleOffsetY));
+
+
   },
 
   focus: function focus(t) {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        box-shadow: ", ";\n        border-color: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])),
 
-    mixins.afterOutline(t),
-    t.radioFocusShadow,
-    t.radioBorderColorFocus);
+    (0, _Radio.afterOutlineMixin)(t.radioOutlineWidth),
+    (0, _Radio.outlineColorMixin)(t.radioFocusShadow, t.radioBorderColorFocus));
 
 
   },
 
   warning: function warning(t) {
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        box-shadow: ", ";\n        border-color: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])),
 
-    mixins.afterOutline(t),
-    t.radioFocusShadow,
-    t.radioBorderColorWarning);
+    (0, _Radio.afterOutlineMixin)(t.radioOutlineWidth),
+    (0, _Radio.outlineColorMixin)(t.radioFocusShadow, t.radioBorderColorWarning));
 
 
   },
 
   error: function error(t) {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        box-shadow: ", ";\n        border-color: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::after {\n        ", ";\n        ", ";\n      }\n    "])),
 
-    mixins.afterOutline(t),
-    t.radioFocusShadow,
-    t.radioBorderColorError);
+    (0, _Radio.afterOutlineMixin)(t.radioOutlineWidth),
+    (0, _Radio.outlineColorMixin)(t.radioFocusShadow, t.radioBorderColorError));
 
 
   },
 
   checked: function checked(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-color: ", ";\n      border-color: ", ";\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        height: ", ";\n        width: ", ";\n        border-radius: 50%;\n        background: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-color: ", ";\n      border-color: ", ";\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        border-radius: 50%;\n        background: ", ";\n      }\n    "])),
     t.radioCheckedBgColor,
     t.radioCheckedBorderColor,
 
@@ -142,24 +162,37 @@ var styles = (0, _Emotion.memoizeStyle)({
 
 
 
-    t.radioBulletSize,
-    t.radioBulletSize,
 
     t.radioCheckedBulletColor);
 
 
+  },
+  checkedSmall: function checkedSmall(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioCheckedMixin)(t.radioBulletSizeSmall));
+
+  },
+  checkedMedium: function checkedMedium(t) {
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioCheckedMixin)(t.radioBulletSizeMedium));
+
+  },
+  checkedLarge: function checkedLarge(t) {
+    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Radio.radioCheckedMixin)(t.radioBulletSizeLarge));
+
   },
 
   checkedDisabled: function checkedDisabled(t) {
-    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::before {\n        background: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &::before {\n        background: ", ";\n      }\n    "])),
 
-    t.gray);
+    t.radioCheckedDisabledBulletBg);
 
 
   },
 
   input: function input() {
-    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    "])));
+    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    "])));
 
 
 
@@ -170,7 +203,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   disabled: function disabled(t) {
-    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", " !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ", " !important; // override root hover/active styles\n    "])),
+    return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", " !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ", " !important; // override root hover/active styles\n    "])),
     t.radioDisabledBg,
 
     t.radioDisabledShadow);
@@ -178,7 +211,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   caption: function caption(t) {
-    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: ", ";\n      padding-left: ", ";\n      white-space: normal;\n      color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: ", ";\n      padding-left: ", ";\n      white-space: normal;\n      color: ", ";\n    "])),
     t.radioCaptionDisplay,
     t.radioCaptionGap,
 
@@ -187,19 +220,19 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   captionIE11: function captionIE11() {
-    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: table-cell;\n    "])));
+    return (0, _Emotion.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: table-cell;\n    "])));
 
 
   },
 
   captionDisabled: function captionDisabled(t) {
-    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
     t.textColorDisabled);
 
   },
 
   placeholder: function placeholder() {
-    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n    "])));
+    return (0, _Emotion.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n    "])));
 
 
   } });exports.styles = styles;

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

@@ -1 +1 @@
-{"version":3,"sources":["Radio.styles.ts"],"names":["globalClasses","circle","mixins","afterOutline","t","css","radioOutlineWidth","radioSizeAfter","styles","root","radioPaddingY","radioLineHeight","radioFontSize","radioHoverBg","radioHoverShadow","radioActiveBg","radioActiveShadow","radioSize","rootIE11","rootChecked","radioCheckedHoverBgColor","labGrotesqueCompenstation","parseInt","labGrotesqueBaselineCompensation","fontSize","checkboxFontSize","baselineCompensation","isChrome","circleSize","radioBorderWidthCompensation","circleOffsetY","radioCircleOffsetY","circleMarginX","radioBgImage","radioBorder","radioBoxShadow","radioBgColor","focus","radioFocusShadow","radioBorderColorFocus","warning","radioBorderColorWarning","error","radioBorderColorError","checked","radioCheckedBgColor","radioCheckedBorderColor","radioBulletSize","radioCheckedBulletColor","checkedDisabled","gray","input","disabled","radioDisabledBg","radioDisabledShadow","caption","radioCaptionDisplay","radioCaptionGap","radioTextColor","captionIE11","captionDisabled","textColorDisabled","placeholder"],"mappings":"oSAAA;;AAEA,0C;;AAEO,IAAMA,aAAa,GAAG,qBAAO,OAAP,EAAgB;AAC3CC,EAAAA,MAAM,EAAE,QADmC,EAAhB,CAAtB,C;;;AAIP,IAAMC,MAAM,GAAG;AACbC,EAAAA,YADa,wBACAC,CADA,EACU;AACrB,eAAOC,YAAP;;;AAGWD,IAAAA,CAAC,CAACE,iBAHb;AAIUF,IAAAA,CAAC,CAACE,iBAJZ;AAKWF,IAAAA,CAAC,CAACG,cALb;AAMYH,IAAAA,CAAC,CAACG,cANd;AAOkBH,IAAAA,CAAC,CAACE,iBAPpB;;;;;AAYD,GAdY,EAAf;;;AAiBO,IAAME,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BL,CAD4B,EAClB;AACb,eAAOC,YAAP;;;;AAIiBD,IAAAA,CAAC,CAACM,aAJnB;AAKoBN,IAAAA,CAAC,CAACM,aALtB;;;AAQiBN,IAAAA,CAAC,CAACO,eARnB;AASeP,IAAAA,CAAC,CAACQ,aATjB;;AAWaZ,IAAAA,aAAa,CAACC,MAX3B;AAYkBG,IAAAA,CAAC,CAACS,YAZpB;AAakBT,IAAAA,CAAC,CAACU,gBAbpB;;AAecd,IAAAA,aAAa,CAACC,MAf5B;AAgBkBG,IAAAA,CAAC,CAACW,aAhBpB;AAiBkBX,IAAAA,CAAC,CAACY,iBAjBpB;;;;;;;;;AA0BaZ,IAAAA,CAAC,CAACa,SA1Bf;;;;AA8BD,GAhCgC;;AAkCjCC,EAAAA,QAlCiC,sBAkCtB;AACT,eAAOb,YAAP;;;AAGD,GAtCgC;;AAwCjCc,EAAAA,WAxCiC,uBAwCrBf,CAxCqB,EAwCX;AACpB,eAAOC,YAAP;AACaL,IAAAA,aAAa,CAACC,MAD3B;AAEkBG,IAAAA,CAAC,CAACgB,wBAFpB;;;AAKD,GA9CgC;;AAgDjCnB,EAAAA,MAhDiC,kBAgD1BG,CAhD0B,EAgDhB;AACf,QAAMiB,yBAAyB,GAAGC,QAAQ,CAAClB,CAAC,CAACmB,gCAAH,CAA1C;AACA,QAAMC,QAAQ,GAAGF,QAAQ,CAAClB,CAAC,CAACqB,gBAAH,CAAzB;AACA,QAAMC,oBAAoB;AACxBF,IAAAA,QAAQ,GAAG,EAAX,IAAiB,CAACG,gBAAlB;AACIN,IAAAA,yBADJ;AAEIG,IAAAA,QAAQ,KAAK,EAAb,IAAmBG,gBAAnB;AACA,KAACN,yBADD;AAEA,KALN;AAMA,QAAMO,UAAU,aAAWxB,CAAC,CAACa,SAAb,eAAgCb,CAAC,CAACyB,4BAAlC,MAAhB;AACA,QAAMC,aAAa,aAAW1B,CAAC,CAAC2B,kBAAb,WAAqC3B,CAAC,CAACyB,4BAAvC,WAAyEH,oBAAzE,QAAnB;AACA,QAAMM,aAAa,GAAG5B,CAAC,CAACyB,4BAAxB;AACA,eAAOxB,YAAP;AACsBD,IAAAA,CAAC,CAAC6B,YADxB;;AAGY7B,IAAAA,CAAC,CAAC8B,WAHd;AAIgB9B,IAAAA,CAAC,CAAC+B,cAJlB;;;AAOYP,IAAAA,UAPZ;AAQWA,IAAAA,UARX;;;AAWYE,IAAAA,aAXZ,EAW6BE,aAX7B;AAYsB5B,IAAAA,CAAC,CAACgC,YAZxB;;AAcD,GA1EgC;;AA4EjCC,EAAAA,KA5EiC,iBA4E3BjC,CA5E2B,EA4EjB;AACd,eAAOC,YAAP;;AAEMH,IAAAA,MAAM,CAACC,YAAP,CAAoBC,CAApB,CAFN;AAGkBA,IAAAA,CAAC,CAACkC,gBAHpB;AAIoBlC,IAAAA,CAAC,CAACmC,qBAJtB;;;AAOD,GApFgC;;AAsFjCC,EAAAA,OAtFiC,mBAsFzBpC,CAtFyB,EAsFf;AAChB,eAAOC,YAAP;;AAEMH,IAAAA,MAAM,CAACC,YAAP,CAAoBC,CAApB,CAFN;AAGkBA,IAAAA,CAAC,CAACkC,gBAHpB;AAIoBlC,IAAAA,CAAC,CAACqC,uBAJtB;;;AAOD,GA9FgC;;AAgGjCC,EAAAA,KAhGiC,iBAgG3BtC,CAhG2B,EAgGjB;AACd,eAAOC,YAAP;;AAEMH,IAAAA,MAAM,CAACC,YAAP,CAAoBC,CAApB,CAFN;AAGkBA,IAAAA,CAAC,CAACkC,gBAHpB;AAIoBlC,IAAAA,CAAC,CAACuC,qBAJtB;;;AAOD,GAxGgC;;AA0GjCC,EAAAA,OA1GiC,mBA0GzBxC,CA1GyB,EA0Gf;AAChB,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACyC,mBADxB;AAEkBzC,IAAAA,CAAC,CAAC0C,uBAFpB;;;;;;;;;;AAYc1C,IAAAA,CAAC,CAAC2C,eAZhB;AAaa3C,IAAAA,CAAC,CAAC2C,eAbf;;AAekB3C,IAAAA,CAAC,CAAC4C,uBAfpB;;;AAkBD,GA7HgC;;AA+HjCC,EAAAA,eA/HiC,2BA+HjB7C,CA/HiB,EA+HP;AACxB,eAAOC,YAAP;;AAEkBD,IAAAA,CAAC,CAAC8C,IAFpB;;;AAKD,GArIgC;;AAuIjCC,EAAAA,KAvIiC,mBAuIzB;AACN,eAAO9C,YAAP;;;;;;;;AAQD,GAhJgC;;AAkJjC+C,EAAAA,QAlJiC,oBAkJxBhD,CAlJwB,EAkJd;AACjB,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACiD,eADlB;;AAGgBjD,IAAAA,CAAC,CAACkD,mBAHlB;;AAKD,GAxJgC;;AA0JjCC,EAAAA,OA1JiC,mBA0JzBnD,CA1JyB,EA0Jf;AAChB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACoD,mBADf;AAEkBpD,IAAAA,CAAC,CAACqD,eAFpB;;AAIWrD,IAAAA,CAAC,CAACsD,cAJb;;AAMD,GAjKgC;;AAmKjCC,EAAAA,WAnKiC,yBAmKnB;AACZ,eAAOtD,YAAP;;;AAGD,GAvKgC;;AAyKjCuD,EAAAA,eAzKiC,2BAyKjBxD,CAzKiB,EAyKP;AACxB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACyD,iBADb;;AAGD,GA7KgC;;AA+KjCC,EAAAA,WA/KiC,yBA+KnB;AACZ,eAAOzD,YAAP;;;AAGD,GAnLgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isChrome } from '../../lib/client';\n\nexport const globalClasses = prefix('radio')({\n  circle: 'circle',\n});\n\nconst mixins = {\n  afterOutline(t: Theme) {\n    return css`\n      content: ' ';\n      position: absolute;\n      left: -${t.radioOutlineWidth};\n      top: -${t.radioOutlineWidth};\n      width: ${t.radioSizeAfter};\n      height: ${t.radioSizeAfter};\n      border-width: ${t.radioOutlineWidth};\n      border-style: solid;\n      border-radius: 50%;\n      box-sizing: border-box;\n    `;\n  },\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      padding-top: ${t.radioPaddingY};\n      padding-bottom: ${t.radioPaddingY};\n      display: inline-flex;\n      align-items: baseline;\n      line-height: ${t.radioLineHeight};\n      font-size: ${t.radioFontSize};\n\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioHoverBg};\n        box-shadow: ${t.radioHoverShadow};\n      }\n      &:active .${globalClasses.circle} {\n        background: ${t.radioActiveBg};\n        box-shadow: ${t.radioActiveShadow};\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        width: ${t.radioSize};\n        flex: 0 0 auto;\n      }\n    `;\n  },\n\n  rootIE11() {\n    return css`\n      display: inline-table;\n    `;\n  },\n\n  rootChecked(t: Theme) {\n    return css`\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioCheckedHoverBgColor};\n      }\n    `;\n  },\n\n  circle(t: Theme) {\n    const labGrotesqueCompenstation = parseInt(t.labGrotesqueBaselineCompensation);\n    const fontSize = parseInt(t.checkboxFontSize);\n    const baselineCompensation =\n      fontSize < 16 && !isChrome\n        ? labGrotesqueCompenstation\n        : fontSize === 16 && isChrome\n        ? -labGrotesqueCompenstation\n        : 0;\n    const circleSize = `calc(${t.radioSize} - 2 * ${t.radioBorderWidthCompensation})`;\n    const circleOffsetY = `calc(${t.radioCircleOffsetY} + ${t.radioBorderWidthCompensation} + ${baselineCompensation}px)`;\n    const circleMarginX = t.radioBorderWidthCompensation;\n    return css`\n      background-image: ${t.radioBgImage};\n      border-radius: 50%;\n      border: ${t.radioBorder};\n      box-shadow: ${t.radioBoxShadow};\n      box-sizing: border-box;\n      display: inline-block;\n      height: ${circleSize};\n      width: ${circleSize};\n      position: absolute;\n      left: 0;\n      margin: ${circleOffsetY} ${circleMarginX} 0;\n      background-color: ${t.radioBgColor};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      &::after {\n        ${mixins.afterOutline(t)};\n        box-shadow: ${t.radioFocusShadow};\n        border-color: ${t.radioBorderColorFocus};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &::after {\n        ${mixins.afterOutline(t)};\n        box-shadow: ${t.radioFocusShadow};\n        border-color: ${t.radioBorderColorWarning};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &::after {\n        ${mixins.afterOutline(t)};\n        box-shadow: ${t.radioFocusShadow};\n        border-color: ${t.radioBorderColorError};\n      }\n    `;\n  },\n\n  checked(t: Theme) {\n    return css`\n      background-color: ${t.radioCheckedBgColor};\n      border-color: ${t.radioCheckedBorderColor};\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        height: ${t.radioBulletSize};\n        width: ${t.radioBulletSize};\n        border-radius: 50%;\n        background: ${t.radioCheckedBulletColor};\n      }\n    `;\n  },\n\n  checkedDisabled(t: Theme) {\n    return css`\n      &::before {\n        background: ${t.gray};\n      }\n    `;\n  },\n\n  input() {\n    return css`\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background: ${t.radioDisabledBg} !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ${t.radioDisabledShadow} !important; // override root hover/active styles\n    `;\n  },\n\n  caption(t: Theme) {\n    return css`\n      display: ${t.radioCaptionDisplay};\n      padding-left: ${t.radioCaptionGap};\n      white-space: normal;\n      color: ${t.radioTextColor};\n    `;\n  },\n\n  captionIE11() {\n    return css`\n      display: table-cell;\n    `;\n  },\n\n  captionDisabled(t: Theme) {\n    return css`\n      color: ${t.textColorDisabled};\n    `;\n  },\n\n  placeholder() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Radio.styles.ts"],"names":["globalClasses","circle","styles","root","t","css","transitionDuration","transitionTimingFunction","radioHoverBg","radioHoverShadow","radioActiveBg","radioActiveShadow","rootSmall","radioFontSizeSmall","radioLineHeightSmall","radioPaddingYSmall","radioSizeSmall","rootMedium","radioFontSizeMedium","radioLineHeightMedium","radioPaddingYMedium","radioSizeMedium","rootLarge","radioFontSizeLarge","radioLineHeightLarge","radioPaddingYLarge","radioSizeLarge","rootIE11","rootChecked","radioCheckedHoverBgColor","radioBgImage","radioBorder","radioBoxShadow","radioBgColor","circleSmall","labGrotesqueBaselineCompensation","radioBorderWidthCompensation","radioCircleOffsetY","circleMedium","circleLarge","focus","radioOutlineWidth","radioFocusShadow","radioBorderColorFocus","warning","radioBorderColorWarning","error","radioBorderColorError","checked","radioCheckedBgColor","radioCheckedBorderColor","radioCheckedBulletColor","checkedSmall","radioBulletSizeSmall","checkedMedium","radioBulletSizeMedium","checkedLarge","radioBulletSizeLarge","checkedDisabled","radioCheckedDisabledBulletBg","input","disabled","radioDisabledBg","radioDisabledShadow","caption","radioCaptionDisplay","radioCaptionGap","radioTextColor","captionIE11","captionDisabled","textColorDisabled","placeholder"],"mappings":"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","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport {\n  afterOutlineMixin,\n  circleSizeMixin,\n  outlineColorMixin,\n  radioCheckedMixin,\n  radioSizeMixin,\n} from './Radio.mixins';\n\nexport const globalClasses = prefix('radio')({\n  circle: 'circle',\n});\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      cursor: pointer;\n      position: relative;\n      white-space: nowrap;\n      display: inline-flex;\n      align-items: baseline;\n\n      .${globalClasses.circle} {\n        transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n      }\n\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioHoverBg};\n        box-shadow: ${t.radioHoverShadow};\n      }\n      &:active .${globalClasses.circle} {\n        background: ${t.radioActiveBg};\n        box-shadow: ${t.radioActiveShadow};\n      }\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned circle,\n        // and also height and baseline for radio without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n    `;\n  },\n  rootSmall(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeSmall, t.radioLineHeightSmall, t.radioPaddingYSmall, t.radioSizeSmall)};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeMedium, t.radioLineHeightMedium, t.radioPaddingYMedium, t.radioSizeMedium)};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${radioSizeMixin(t.radioFontSizeLarge, t.radioLineHeightLarge, t.radioPaddingYLarge, t.radioSizeLarge)};\n    `;\n  },\n\n  rootIE11() {\n    return css`\n      display: inline-table;\n    `;\n  },\n\n  rootChecked(t: Theme) {\n    return css`\n      &:hover .${globalClasses.circle} {\n        background: ${t.radioCheckedHoverBgColor};\n      }\n    `;\n  },\n\n  circle(t: Theme) {\n    return css`\n      background-image: ${t.radioBgImage};\n      border-radius: 50%;\n      border: ${t.radioBorder};\n      box-shadow: ${t.radioBoxShadow};\n      box-sizing: border-box;\n      display: inline-block;\n      position: absolute;\n      left: 0;\n      background-color: ${t.radioBgColor};\n    `;\n  },\n  circleSmall(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeSmall,\n        t.radioSizeSmall,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleMedium(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeMedium,\n        t.radioSizeMedium,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n  circleLarge(t: Theme) {\n    return css`\n      ${circleSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.radioFontSizeLarge,\n        t.radioSizeLarge,\n        t.radioBorderWidthCompensation,\n        t.radioCircleOffsetY,\n      )};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorFocus)};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorWarning)};\n      }\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      &::after {\n        ${afterOutlineMixin(t.radioOutlineWidth)};\n        ${outlineColorMixin(t.radioFocusShadow, t.radioBorderColorError)};\n      }\n    `;\n  },\n\n  checked(t: Theme) {\n    return css`\n      background-color: ${t.radioCheckedBgColor};\n      border-color: ${t.radioCheckedBorderColor};\n\n      &::before {\n        content: ' ';\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        margin: auto;\n        border-radius: 50%;\n        background: ${t.radioCheckedBulletColor};\n      }\n    `;\n  },\n  checkedSmall(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeSmall)};\n    `;\n  },\n  checkedMedium(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeMedium)};\n    `;\n  },\n  checkedLarge(t: Theme) {\n    return css`\n      ${radioCheckedMixin(t.radioBulletSizeLarge)};\n    `;\n  },\n\n  checkedDisabled(t: Theme) {\n    return css`\n      &::before {\n        background: ${t.radioCheckedDisabledBulletBg};\n      }\n    `;\n  },\n\n  input() {\n    return css`\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      background: ${t.radioDisabledBg} !important; // override root hover/active styles\n      border-color: transparent !important; // override root hover/active styles\n      box-shadow: ${t.radioDisabledShadow} !important; // override root hover/active styles\n    `;\n  },\n\n  caption(t: Theme) {\n    return css`\n      display: ${t.radioCaptionDisplay};\n      padding-left: ${t.radioCaptionGap};\n      white-space: normal;\n      color: ${t.radioTextColor};\n    `;\n  },\n\n  captionIE11() {\n    return css`\n      display: table-cell;\n    `;\n  },\n\n  captionDisabled(t: Theme) {\n    return css`\n      color: ${t.textColorDisabled};\n    `;\n  },\n\n  placeholder() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"]}

package/cjs/components/RadioGroup/RadioGroup.d.ts

@@ -1,5 +1,4 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { AriaAttributes } from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { Prevent } from './Prevent';
 export interface RadioGroupProps<T = string | number> extends CommonProps {
@@ -10,7 +9,7 @@ export interface RadioGroupProps<T = string | number> extends CommonProps {
     defaultValue?: T;
     /**
      * Значение радиогруппы. Должно быть одним из значений радиокнопок.
-     * Если не указано, то компонент будет работать, как неконтроллируемый
+     * Если не указано, то компонент будет работать, как неконтролируемый
      */
     value?: T;
     /**
@@ -22,12 +21,17 @@ export interface RadioGroupProps<T = string | number> extends CommonProps {
      * Если тип `items: Array<Value>`, то он будет приведен к типу
      * `Array<[Value, Value]>`
      */
-    items?: T[] | [T, React.ReactNode][];
+    items?: T[] | Array<[T, React.ReactNode]>;
     /**
      * Аттрибут name для вложенных радиокнопок. Если не указан, то сгенерируется
      * случайное имя
      */
     name?: string;
+    /**
+     * Метод получения уникального ключа по элементу
+     * @param item
+     */
+    toKey?: (item: T) => string | number;
     /**
      * Дизейблит все радиокнопки
      */
@@ -54,66 +58,44 @@ export interface RadioGroupProps<T = string | number> extends CommonProps {
      * Принимает два аргумента: `(value: Value, data: Data) => React.Node`
      */
     renderItem?: (itemValue: T, data: React.ReactNode) => React.ReactNode;
+    /**
+     * Атрибут для указания id элемента(-ов), описывающих его
+     */
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
     /** Вызывается при изменении `value` */
     onValueChange?: (value: T) => void;
     onBlur?: (event: FocusEvent) => void;
     onMouseLeave?: () => any;
     onMouseOver?: () => any;
     onMouseEnter?: () => any;
-    /**
-     * Может быть использовано, если не передан параметр `items`
-     *
-     * `children` может содержать любую разметку с компонентами Radio.
-     * Каждому компоненту Radio нужно указать параметр `value`, такого же типа
-     * как и параметр `value` самой радиогруппы.
-     *
-     * Значения активного элемента сравниваются по строгому равенству `===`
-     */
-    children?: React.ReactNode;
 }
 export interface RadioGroupState<T> {
     activeItem?: T;
 }
+export declare const RadioGroupDataTids: {
+    readonly root: "RadioGroup__root";
+};
+declare type DefaultProps = Required<Pick<RadioGroupProps<unknown>, 'renderItem'>>;
+/**
+ *
+ * `children` может содержать любую разметку с компонентами Radio,
+ * если не передан параметр `items`.
+ * Каждому компоненту Radio нужно указать параметр `value`, такого же типа
+ * как и параметр `value` самой радиогруппы.
+ *
+ * Значения активного элемента сравниваются по строгому равенству `===`
+ */
 export declare class RadioGroup<T> extends React.Component<RadioGroupProps<T>, RadioGroupState<T>> {
     static __KONTUR_REACT_UI__: string;
-    static childContextTypes: {
-        error: PropTypes.Requireable<boolean>;
-        name: PropTypes.Requireable<string>;
-        warning: PropTypes.Requireable<boolean>;
-        disabled: PropTypes.Requireable<boolean>;
-        activeItem: PropTypes.Requireable<any>;
-        onSelect: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static propTypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        disabled: PropTypes.Requireable<boolean>;
-        error: PropTypes.Requireable<boolean>;
-        inline: PropTypes.Requireable<boolean>;
-        name: PropTypes.Requireable<string>;
-        warning: PropTypes.Requireable<boolean>;
-        width: PropTypes.Requireable<string | number>;
-        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
-        onMouseEnter: PropTypes.Requireable<(...args: any[]) => any>;
-        onMouseLeave: PropTypes.Requireable<(...args: any[]) => any>;
-        onMouseOver: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static defaultProps: {
-        renderItem: typeof renderItem;
-    };
+    static defaultProps: DefaultProps;
     static Prevent: typeof Prevent;
     private theme;
     private node;
     private name;
     private getProps;
+    private setRootNode;
     constructor(props: RadioGroupProps<T>);
-    getChildContext(): {
-        activeItem: T | undefined;
-        onSelect: (value: T) => void;
-        name: string;
-        disabled: boolean | undefined;
-        error: boolean | undefined;
-        warning: boolean | undefined;
-    };
+    private getRadioGroupContextValue;
     render(): JSX.Element;
     renderMain(): JSX.Element;
     /**
@@ -126,7 +108,7 @@ export declare class RadioGroup<T> extends React.Component<RadioGroupProps<T>, R
     private handleSelect;
     private renderChildren;
     private renderRadio;
+    private getKeyByItem;
     private ref;
 }
-declare function renderItem<T>(_value: T, data: React.ReactNode): React.ReactNode;
 export {};