@skbkontur/react-ui 6.4.1-8cb58.0 → 6.4.2-static-css.0

package/components/Center/Center.js.map

@@ -1 +1 @@
-{"version":3,"file":"Center.js","sourceRoot":"","sources":["Center.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAe/C,MAAM,CAAC,IAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,cAAc;CACZ,CAAC;AAKX;;;;GAIG;AAGH;IAA4B,0BAA4B;IAAxD;;QAOU,cAAQ,GAAG,iBAAiB,CAAC,QAAM,CAAC,YAAY,CAAC,CAAC;QAiBlD,gBAAU,GAAG,UAAC,KAAqD;;YACjE,IAAA,KAAK,GAAc,KAAK,MAAnB,EAAK,IAAI,UAAK,KAAK,EAA1B,SAAkB,CAAF,CAAW;YAEjC,OAAO,CACL,kDACY,cAAc,CAAC,IAAI,IACzB,IAAI,IACR,SAAS,EAAE,KAAI,CAAC,EAAE;oBAChB,GAAC,KAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAG,IAAI;oBAC1B,GAAC,KAAI,CAAC,MAAM,CAAC,aAAa,EAAE,IAAG,KAAK,KAAK,MAAM;oBAC/C,GAAC,KAAI,CAAC,MAAM,CAAC,cAAc,EAAE,IAAG,KAAK,KAAK,OAAO;wBACjD;gBAEF,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,MAAM,EAAE,GAAI;gBACzC,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,SAAS,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CAClE,CACP,CAAC;QACJ,CAAC,CAAC;;IACJ,CAAC;eA1CY,MAAM;IAeV,uBAAM,GAAb;QACE,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,IAAI,CAAC,WAAW,IAAM,IAAI,CAAC,QAAQ,EAAE,GAC9D,IAAI,CAAC,UAAU,CACF,CACjB,CAAC;IACJ,CAAC;;IAtBa,0BAAmB,GAAG,QAAQ,AAAX,CAAY;IAC/B,kBAAW,GAAG,QAAQ,AAAX,CAAY;IAEvB,mBAAY,GAAiB;QACzC,KAAK,EAAE,QAAQ;KAChB,AAFyB,CAExB;IANS,MAAM;QAFlB,qBAAqB;QACrB,QAAQ;OACI,MAAM,CA0ClB;IAAD,aAAC;CAAA,AA1CD,CAA4B,KAAK,CAAC,SAAS,GA0C1C;SA1CY,MAAM","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles } from './Center.styles.js';\n\nexport type HorizontalAlign = 'left' | 'center' | 'right';\n\nexport interface CenterProps\n  extends\n    CommonProps,\n    Override<\n      React.HTMLAttributes<HTMLDivElement>,\n      {\n        /** Выравнивает контент по горизонтали: слева, по центру или справа. */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\ntype DefaultProps = Required<Pick<CenterProps, 'align'>>;\ntype DefaultizedCenterProps = DefaultizedProps<CenterProps, DefaultProps>;\n\n/**\n * Контейнер, который центрирует элементы внутри себя.\n *\n * Выравнивание задаётся пропом `align`: слева, по центру или справа.\n */\n@withRenderEnvironment\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n  public static displayName = 'Center';\n\n  public static defaultProps: DefaultProps = {\n    align: 'center',\n  };\n  private getProps = createPropsGetter(Center.defaultProps);\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n        {this.renderMain}\n      </CommonWrapper>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={this.cx({\n          [this.styles.root()]: true,\n          [this.styles.rootAlignLeft()]: align === 'left',\n          [this.styles.rootAlignRight()]: align === 'right',\n        })}\n      >\n        <span className={this.styles.spring()} />\n        <span className={this.styles.container()}>{this.props.children}</span>\n      </div>\n    );\n  };\n}\n"]}
+{"version":3,"file":"Center.js","sourceRoot":"","sources":["Center.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAGvD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAe/C,MAAM,CAAC,IAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,cAAc;CACZ,CAAC;AAKX;;;;GAIG;AAGH;IAA4B,0BAA4B;IAAxD;;QAOU,cAAQ,GAAG,iBAAiB,CAAC,QAAM,CAAC,YAAY,CAAC,CAAC;QAgBlD,gBAAU,GAAG,UAAC,KAAqD;;YACjE,IAAA,KAAK,GAAc,KAAK,MAAnB,EAAK,IAAI,UAAK,KAAK,EAA1B,SAAkB,CAAF,CAAW;YAEjC,OAAO,CACL,kDACY,cAAc,CAAC,IAAI,IACzB,IAAI,IACR,SAAS,EAAE,KAAI,CAAC,EAAE;oBAChB,GAAC,KAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAG,IAAI;oBAC1B,GAAC,KAAI,CAAC,MAAM,CAAC,aAAa,EAAE,IAAG,KAAK,KAAK,MAAM;oBAC/C,GAAC,KAAI,CAAC,MAAM,CAAC,cAAc,EAAE,IAAG,KAAK,KAAK,OAAO;wBACjD;gBAEF,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,MAAM,EAAE,GAAI;gBACzC,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,SAAS,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CAClE,CACP,CAAC;QACJ,CAAC,CAAC;;IACJ,CAAC;eAzCY,MAAM;IAcV,uBAAM,GAAb;QACE,IAAI,CAAC,MAAM,GAAG,SAAS,EAAE,CAAC;QAE1B,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,IAAI,CAAC,WAAW,IAAM,IAAI,CAAC,QAAQ,EAAE,GAC9D,IAAI,CAAC,UAAU,CACF,CACjB,CAAC;IACJ,CAAC;;IArBa,0BAAmB,GAAG,QAAQ,AAAX,CAAY;IAC/B,kBAAW,GAAG,QAAQ,AAAX,CAAY;IAEvB,mBAAY,GAAiB;QACzC,KAAK,EAAE,QAAQ;KAChB,AAFyB,CAExB;IANS,MAAM;QAFlB,qBAAqB;QACrB,QAAQ;OACI,MAAM,CAyClB;IAAD,aAAC;CAAA,AAzCD,CAA4B,KAAK,CAAC,SAAS,GAyC1C;SAzCY,MAAM","sourcesContent":["import React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { ClassNames } from '../../lib/theming/Emotion.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles } from './Center.styles.js';\n\nexport type HorizontalAlign = 'left' | 'center' | 'right';\n\nexport interface CenterProps\n  extends\n    CommonProps,\n    Override<\n      React.HTMLAttributes<HTMLDivElement>,\n      {\n        /** Выравнивает контент по горизонтали: слева, по центру или справа. */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\ntype DefaultProps = Required<Pick<CenterProps, 'align'>>;\ntype DefaultizedCenterProps = DefaultizedProps<CenterProps, DefaultProps>;\n\n/**\n * Контейнер, который центрирует элементы внутри себя.\n *\n * Выравнивание задаётся пропом `align`: слева, по центру или справа.\n */\n@withRenderEnvironment\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n  public static displayName = 'Center';\n\n  public static defaultProps: DefaultProps = {\n    align: 'center',\n  };\n  private getProps = createPropsGetter(Center.defaultProps);\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private cx!: ClassNames;\n  private styles!: ReturnType<typeof getStyles>;\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles();\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n        {this.renderMain}\n      </CommonWrapper>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={this.cx({\n          [this.styles.root()]: true,\n          [this.styles.rootAlignLeft()]: align === 'left',\n          [this.styles.rootAlignRight()]: align === 'right',\n        })}\n      >\n        <span className={this.styles.spring()} />\n        <span className={this.styles.container()}>{this.props.children}</span>\n      </div>\n    );\n  };\n}\n"]}

package/components/Center/Center.styles.d.ts

@@ -1,7 +1,8 @@
-export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
-    root(): string;
-    rootAlignLeft(): string;
-    rootAlignRight(): string;
-    spring(): string;
-    container(): string;
+/** Правила — в `Center.css`; здесь только имена классов. */
+export declare const getStyles: (ignored?: unknown) => import("../../lib/theming/staticStyles.js").StaticStyles<{
+    root: string;
+    rootAlignLeft: string;
+    rootAlignRight: string;
+    spring: string;
+    container: string;
 }>;

package/components/Center/Center.styles.js

@@ -1,27 +1,10 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
-export var getStyles = memoizeGetStyles(function (_a) {
-    var css = _a.css;
-    return ({
-        root: function () {
-            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      height: 100%;\n      text-align: center;\n    "], ["\n      height: 100%;\n      text-align: center;\n    "])));
-        },
-        rootAlignLeft: function () {
-            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      text-align: left;\n    "], ["\n      text-align: left;\n    "])));
-        },
-        rootAlignRight: function () {
-            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      text-align: right;\n    "], ["\n      text-align: right;\n    "])));
-        },
-        spring: function () {
-            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    "], ["\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    "])));
-        },
-        container: function () {
-            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    "], ["\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    "])));
-        },
-    });
+import { staticStyles } from '../../lib/theming/staticStyles.js';
+/** Правила — в `Center.css`; здесь только имена классов. */
+export var getStyles = staticStyles({
+    root: 'react-ui-Center-root',
+    rootAlignLeft: 'react-ui-Center-rootAlignLeft',
+    rootAlignRight: 'react-ui-Center-rootAlignRight',
+    spring: 'react-ui-Center-spring',
+    container: 'react-ui-Center-container',
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
 //# sourceMappingURL=Center.styles.js.map

package/components/Center/Center.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Center.styles.js","sourceRoot":"","sources":["Center.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI;YACF,OAAO,GAAG,2HAAA,wDAGT,KAAC;QACJ,CAAC;QAED,aAAa;YACX,OAAO,GAAG,oGAAA,iCAET,KAAC;QACJ,CAAC;QAED,cAAc;YACZ,OAAO,GAAG,qGAAA,kCAET,KAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,GAAG,6JAAA,0FAIT,KAAC;QACJ,CAAC;QAED,SAAS;YACP,OAAO,GAAG,iKAAA,8FAIT,KAAC;QACJ,CAAC;KACF,CAAC;AAnC8D,CAmC9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root() {\n    return css`\n      height: 100%;\n      text-align: center;\n    `;\n  },\n\n  rootAlignLeft() {\n    return css`\n      text-align: left;\n    `;\n  },\n\n  rootAlignRight() {\n    return css`\n      text-align: right;\n    `;\n  },\n\n  spring() {\n    return css`\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    `;\n  },\n\n  container() {\n    return css`\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    `;\n  },\n}));\n"]}
+{"version":3,"file":"Center.styles.js","sourceRoot":"","sources":["Center.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,4DAA4D;AAC5D,MAAM,CAAC,IAAM,SAAS,GAAG,YAAY,CAAC;IACpC,IAAI,EAAE,sBAAsB;IAC5B,aAAa,EAAE,+BAA+B;IAC9C,cAAc,EAAE,gCAAgC;IAChD,MAAM,EAAE,wBAAwB;IAChC,SAAS,EAAE,2BAA2B;CACvC,CAAC,CAAC","sourcesContent":["import { staticStyles } from '../../lib/theming/staticStyles.js';\n\n/** Правила — в `Center.css`; здесь только имена классов. */\nexport const getStyles = staticStyles({\n  root: 'react-ui-Center-root',\n  rootAlignLeft: 'react-ui-Center-rootAlignLeft',\n  rootAlignRight: 'react-ui-Center-rootAlignRight',\n  spring: 'react-ui-Center-spring',\n  container: 'react-ui-Center-container',\n});\n"]}

package/components/Checkbox/Checkbox.d.ts

@@ -49,6 +49,14 @@ export declare class Checkbox extends React.PureComponent<CheckboxProps, Checkbo
     static displayName: string;
     private getRootSizeClassName;
     private getBoxWrapperSizeClassName;
+    private getCheckboxFontSize;
+    /**
+     * Ветвление компенсации базовой линии немонотонно (на 17px компенсации нет) и
+     * в `calc()` не выражается, поэтому размер шрифта читается из темы здесь, а в
+     * разметку уходит один из готовых статических классов. Класс идёт в `cx`
+     * после размерного и перебивает его `margin-top`.
+     */
+    private getBoxWrapperBaselineCompensationClassName;
     private getCheckboxBoxSize;
     state: {
         focusedByTab: boolean;
@@ -57,7 +65,6 @@ export declare class Checkbox extends React.PureComponent<CheckboxProps, Checkbo
     };
     private size;
     private globalObject;
-    private emotion;
     private cx;
     private styles;
     private theme;

package/components/Checkbox/Checkbox.js

@@ -50,6 +50,7 @@ import { KeyListener } from '../../lib/events/keyListener.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { rootNode } from '../../lib/rootNode/index.js';
 import { withSize } from '../../lib/size/SizeDecorator.js';
+import { getBaselineCompensationVariant } from '../../lib/styles/baselineCompensation.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { getStyles, globalClasses } from './Checkbox.styles.js';
 import { CheckedIcon } from './CheckedIcon.js';
@@ -134,28 +135,28 @@ var Checkbox = /** @class */ (function (_super) {
             var IconSquare = (React.createElement("span", { className: iconClass },
                 React.createElement(IndeterminateIcon, { size: iconSize })));
             var rootClass = _this.cx(_this.getRootSizeClassName(), (_a = {},
-                _a[_this.styles.root(_this.theme)] = true,
-                _a[_this.styles.rootChecked(_this.theme)] = props.checked || isIndeterminate,
+                _a[_this.styles.root()] = true,
+                _a[_this.styles.rootChecked()] = props.checked || isIndeterminate,
                 _a[_this.styles.rootDisableTextSelect()] = _this.state.isShiftPressed,
-                _a[_this.styles.disabled(_this.theme)] = Boolean(_this.props.disabled),
+                _a[_this.styles.disabled()] = Boolean(_this.props.disabled),
                 _a));
             var inputProps = __assign(__assign({}, rest), { type: 'checkbox', className: _this.styles.input(), onChange: _this.handleChange, onFocus: _this.handleFocus, onBlur: _this.handleBlur, onClick: _this.handleInputClick, ref: _this.input });
             var box = (React.createElement("div", { className: _this.cx(_this.getBoxWrapperSizeClassName(), (_b = {},
-                    _b[_this.styles.boxWrapper(_this.theme)] = true,
-                    _b)) },
-                React.createElement("div", { className: _this.cx(_this.styles.box(_this.theme), globalClasses.box, (_c = {},
-                        _c[_this.styles.boxChecked(_this.theme)] = _this.props.checked || isIndeterminate,
-                        _c[_this.styles.boxFocus(_this.theme)] = _this.state.focusedByTab,
-                        _c[_this.styles.boxError(_this.theme)] = _this.props.error,
-                        _c[_this.styles.boxWarning(_this.theme)] = _this.props.warning,
-                        _c[_this.styles.boxDisabled(_this.theme)] = _this.props.disabled,
+                    _b[_this.styles.boxWrapper()] = true,
+                    _b), _this.getBoxWrapperBaselineCompensationClassName()) },
+                React.createElement("div", { className: _this.cx(_this.styles.box(), globalClasses.box, (_c = {},
+                        _c[_this.styles.boxChecked()] = _this.props.checked || isIndeterminate,
+                        _c[_this.styles.boxFocus()] = _this.state.focusedByTab,
+                        _c[_this.styles.boxError()] = _this.props.error,
+                        _c[_this.styles.boxWarning()] = _this.props.warning,
+                        _c[_this.styles.boxDisabled()] = _this.props.disabled,
                         _c)) }, (isIndeterminate && IconSquare) || IconCheck)));
             return (React.createElement("label", { "data-tid": CheckboxDataTids.root, className: rootClass, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, onClick: _this.handleLabelClick },
                 React.createElement(FocusControlWrapper, { onBlurWhenDisabled: _this.resetFocus },
                     React.createElement("input", __assign({}, inputProps, { "aria-label": ariaLabel, "aria-describedby": ariaDescribedby }))),
                 box,
                 _this.props.children &&
-                    (comment ? (React.createElement("div", { className: _this.styles.captionWrapper(_this.theme) },
+                    (comment ? (React.createElement("div", { className: _this.styles.captionWrapper() },
                         _this.renderCaption(Boolean(props.disabled), true),
                         _this.renderComment(Boolean(props.disabled)))) : (_this.renderCaption(Boolean(props.disabled), false)))));
         };
@@ -203,23 +204,53 @@ var Checkbox = /** @class */ (function (_super) {
     Checkbox.prototype.getRootSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.rootLarge(this.theme);
+                return this.styles.rootLarge();
             case 'medium':
-                return this.styles.rootMedium(this.theme);
+                return this.styles.rootMedium();
             case 'small':
             default:
-                return this.styles.rootSmall(this.theme);
+                return this.styles.rootSmall();
         }
     };
     Checkbox.prototype.getBoxWrapperSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.boxWrapperLarge(this.theme);
+                return this.styles.boxWrapperLarge();
             case 'medium':
-                return this.styles.boxWrapperMedium(this.theme);
+                return this.styles.boxWrapperMedium();
             case 'small':
             default:
-                return this.styles.boxWrapperSmall(this.theme);
+                return this.styles.boxWrapperSmall();
+        }
+    };
+    Checkbox.prototype.getCheckboxFontSize = function () {
+        switch (this.size) {
+            case 'large':
+                return this.theme.checkboxFontSizeLarge;
+            case 'medium':
+                return this.theme.checkboxFontSizeMedium;
+            case 'small':
+            default:
+                return this.theme.checkboxFontSizeSmall;
+        }
+    };
+    /**
+     * Ветвление компенсации базовой линии немонотонно (на 17px компенсации нет) и
+     * в `calc()` не выражается, поэтому размер шрифта читается из темы здесь, а в
+     * разметку уходит один из готовых статических классов. Класс идёт в `cx`
+     * после размерного и перебивает его `margin-top`.
+     */
+    Checkbox.prototype.getBoxWrapperBaselineCompensationClassName = function () {
+        switch (getBaselineCompensationVariant(parseInt(this.getCheckboxFontSize()))) {
+            case 'lessThan16':
+                return this.styles.boxWrapperBaselineCompensationLessThan16();
+            case 'exactly16':
+                return this.styles.boxWrapperBaselineCompensationExactly16();
+            case 'exactly18':
+                return this.styles.boxWrapperBaselineCompensationExactly18();
+            case 'none':
+            default:
+                return undefined;
         }
     };
     Checkbox.prototype.getCheckboxBoxSize = function () {
@@ -240,7 +271,7 @@ var Checkbox = /** @class */ (function (_super) {
     };
     Checkbox.prototype.render = function () {
         var _this = this;
-        this.styles = getStyles(this.emotion);
+        this.styles = getStyles();
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.getProps()), _this.renderMain));
@@ -266,27 +297,27 @@ var Checkbox = /** @class */ (function (_super) {
     Checkbox.prototype.getSubcaptionSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.subcaptionLarge(this.theme);
+                return this.styles.subcaptionLarge();
             case 'medium':
-                return this.styles.subcaptionMedium(this.theme);
+                return this.styles.subcaptionMedium();
             case 'small':
             default:
-                return this.styles.subcaptionSmall(this.theme);
+                return this.styles.subcaptionSmall();
         }
     };
     Checkbox.prototype.renderCaption = function (disabled, noGap) {
         var _a;
         var captionClass = this.cx((_a = {},
-            _a[this.styles.caption(this.theme)] = true,
-            _a[this.styles.disabled(this.theme)] = disabled,
+            _a[this.styles.caption()] = true,
+            _a[this.styles.disabled()] = disabled,
             _a[this.styles.captionNoGap()] = noGap,
             _a));
         return React.createElement("div", { className: captionClass }, this.props.children);
     };
     Checkbox.prototype.renderComment = function (disabled) {
         var _a;
-        return (React.createElement("div", { className: this.cx(this.styles.subcaption(this.theme), this.getSubcaptionSizeClassName(), (_a = {},
-                _a[this.styles.subcaptionDisabled(this.theme)] = disabled,
+        return (React.createElement("div", { className: this.cx(this.styles.subcaption(), this.getSubcaptionSizeClassName(), (_a = {},
+                _a[this.styles.subcaptionDisabled()] = disabled,
                 _a)) }, this.props.comment));
     };
     Checkbox.__KONTUR_REACT_UI__ = 'Checkbox';

package/components/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["Checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { fixFirefoxModifiedClickOnLabel } from '../../lib/events/fixFirefoxModifiedClickOnLabel.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { withSize } from '../../lib/size/SizeDecorator.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles, globalClasses } from './Checkbox.styles.js';\nimport { CheckedIcon } from './CheckedIcon.js';\nimport { IndeterminateIcon } from './IndeterminateIcon.js';\n\nexport interface CheckboxProps\n  extends\n    CommonProps,\n    Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n    Override<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      {\n        /** @ignore */\n        children?: React.ReactNode;\n\n        /** Переводит контрол в состояние ошибки. */\n        error?: boolean;\n\n        /** Переводит контрол в состояние предупреждения. */\n        warning?: boolean;\n\n        /** Размер чекбокса. */\n        size?: SizeProp;\n\n        /** HTML-событие `onmouseenter`.\n         * @ignore */\n        onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** HTML-событие `onmouseleave`.\n         * @ignore */\n        onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** HTML-событие `onmouseover`.\n         * @ignore */\n        onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** Событие изменения value. */\n        onValueChange?: (value: boolean) => void;\n\n        /** HTML-событие `onblur`.\n         * @ignore */\n        onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n        /** Устанавливает начальное [неопределенное состояние чекбокса](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#attr-indeterminate). */\n        initialIndeterminate?: boolean;\n\n        /** Задаёт второстепенный пояснительный текст под основным текстом чекбокса. */\n        comment?: React.ReactNode;\n      }\n    > {}\n\nexport interface CheckboxState {\n  focusedByTab: boolean;\n  indeterminate: boolean;\n  isShiftPressed: boolean;\n}\n\nexport const CheckboxDataTids = {\n  root: 'Checkbox__root',\n} as const;\n\n/**\n * Чекбокс используется для управления параметром с двумя состояниями.\n */\n@withRenderEnvironment\n@rootNode\n@withSize\nexport class Checkbox extends React.PureComponent<CheckboxProps, CheckboxState> {\n  public static __KONTUR_REACT_UI__ = 'Checkbox';\n  public static displayName = 'Checkbox';\n\n  private getRootSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.rootLarge(this.theme);\n      case 'medium':\n        return this.styles.rootMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.rootSmall(this.theme);\n    }\n  }\n\n  private getBoxWrapperSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.boxWrapperLarge(this.theme);\n      case 'medium':\n        return this.styles.boxWrapperMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.boxWrapperSmall(this.theme);\n    }\n  }\n\n  private getCheckboxBoxSize() {\n    switch (this.size) {\n      case 'large':\n        return this.theme.checkboxBoxSizeLarge;\n      case 'medium':\n        return this.theme.checkboxBoxSizeMedium;\n      case 'small':\n      default:\n        return this.theme.checkboxBoxSizeSmall;\n    }\n  }\n\n  public state = {\n    focusedByTab: false,\n    indeterminate: this.props.initialIndeterminate || false,\n    isShiftPressed: false,\n  };\n  private size!: SizeProp;\n\n  private globalObject!: GlobalObject;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n  private theme!: Theme;\n  private input = React.createRef<HTMLInputElement>();\n  private getProps = createPropsGetter({});\n  private keyListener!: KeyListener;\n\n  private handleShiftPress = (e: KeyboardEvent) => {\n    if (e.key === 'Shift') {\n      this.setState(() => ({\n        isShiftPressed: true,\n      }));\n    }\n  };\n\n  private handleShiftRelease = (e: KeyboardEvent) => {\n    if (e.key === 'Shift') {\n      this.setState({\n        isShiftPressed: false,\n      });\n    }\n  };\n\n  public componentDidMount = () => {\n    this.keyListener = new KeyListener(this.globalObject);\n    if (this.state.indeterminate && this.input.current) {\n      this.input.current.indeterminate = true;\n    }\n\n    this.globalObject.document?.addEventListener('keydown', this.handleShiftPress);\n    this.globalObject.document?.addEventListener('keyup', this.handleShiftRelease);\n  };\n\n  public componentWillUnmount = () => {\n    this.globalObject.document?.removeEventListener('keydown', this.handleShiftPress);\n    this.globalObject.document?.removeEventListener('keyup', this.handleShiftRelease);\n  };\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidUpdate(prevProps: CheckboxProps) {\n    if (prevProps.checked !== this.props.checked) {\n      this.resetIndeterminate();\n    }\n  }\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * Программно устанавливает фокус на чекбокс.\n   * @public\n   */\n  public focus(): void {\n    this.keyListener.isTabPressed = true;\n    this.input.current?.focus();\n  }\n\n  /**\n   * Программно снимает фокус с чекбокса.\n   * @public\n   */\n  public blur(): void {\n    this.input.current?.blur();\n  }\n\n  /**\n   * Устанавливает чекбокс в HTML-состояние `indeterminate`.\n   * @public\n   */\n  public setIndeterminate = (): void => {\n    this.setState({\n      indeterminate: true,\n    });\n    if (this.input.current) {\n      this.input.current.indeterminate = true;\n    }\n  };\n\n  /**\n   * Снимает с чекбокса HTML-состояние `indeterminate`.\n   * @public\n   */\n  public resetIndeterminate = (): void => {\n    this.setState({\n      indeterminate: false,\n    });\n    if (this.input.current) {\n      this.input.current.indeterminate = false;\n    }\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<CheckboxProps>) => {\n    const {\n      error,\n      warning,\n      size,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onValueChange,\n      onClick,\n      type,\n      initialIndeterminate,\n      comment,\n      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n      ...rest\n    } = props;\n    const isIndeterminate = this.state.indeterminate;\n\n    const iconClass = this.cx(\n      this.styles.icon(),\n      !this.props.checked && !isIndeterminate && this.styles.iconUnchecked(),\n    );\n\n    const iconSize = parseInt(this.getCheckboxBoxSize());\n    const IconCheck = (\n      <span className={iconClass}>\n        <CheckedIcon size={iconSize} />\n      </span>\n    );\n    const IconSquare = (\n      <span className={iconClass}>\n        <IndeterminateIcon size={iconSize} />\n      </span>\n    );\n\n    const rootClass = this.cx(this.getRootSizeClassName(), {\n      [this.styles.root(this.theme)]: true,\n      [this.styles.rootChecked(this.theme)]: props.checked || isIndeterminate,\n      [this.styles.rootDisableTextSelect()]: this.state.isShiftPressed,\n      [this.styles.disabled(this.theme)]: Boolean(this.props.disabled),\n    });\n\n    const inputProps = {\n      ...rest,\n      type: 'checkbox',\n      className: this.styles.input(),\n      onChange: this.handleChange,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      onClick: this.handleInputClick,\n      ref: this.input,\n    };\n\n    const box = (\n      <div\n        className={this.cx(this.getBoxWrapperSizeClassName(), {\n          [this.styles.boxWrapper(this.theme)]: true,\n        })}\n      >\n        <div\n          className={this.cx(this.styles.box(this.theme), globalClasses.box, {\n            [this.styles.boxChecked(this.theme)]: this.props.checked || isIndeterminate,\n            [this.styles.boxFocus(this.theme)]: this.state.focusedByTab,\n            [this.styles.boxError(this.theme)]: this.props.error,\n            [this.styles.boxWarning(this.theme)]: this.props.warning,\n            [this.styles.boxDisabled(this.theme)]: this.props.disabled,\n          })}\n        >\n          {(isIndeterminate && IconSquare) || IconCheck}\n        </div>\n      </div>\n    );\n\n    return (\n      <label\n        data-tid={CheckboxDataTids.root}\n        className={rootClass}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        onMouseOver={onMouseOver}\n        onClick={this.handleLabelClick}\n      >\n        <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n          <input {...inputProps} aria-label={ariaLabel} aria-describedby={ariaDescribedby} />\n        </FocusControlWrapper>\n        {box}\n        {this.props.children &&\n          (comment ? (\n            <div className={this.styles.captionWrapper(this.theme)}>\n              {this.renderCaption(Boolean(props.disabled), true)}\n              {this.renderComment(Boolean(props.disabled))}\n            </div>\n          ) : (\n            this.renderCaption(Boolean(props.disabled), false)\n          ))}\n      </label>\n    );\n  };\n\n  private getSubcaptionSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.subcaptionLarge(this.theme);\n      case 'medium':\n        return this.styles.subcaptionMedium(this.theme);\n      case 'small':\n      default:\n        return this.styles.subcaptionSmall(this.theme);\n    }\n  }\n\n  private renderCaption(disabled: boolean, noGap: boolean) {\n    const captionClass = this.cx({\n      [this.styles.caption(this.theme)]: true,\n      [this.styles.disabled(this.theme)]: disabled,\n      [this.styles.captionNoGap()]: noGap,\n    });\n\n    return <div className={captionClass}>{this.props.children}</div>;\n  }\n\n  private renderComment(disabled: boolean) {\n    return (\n      <div\n        className={this.cx(this.styles.subcaption(this.theme), this.getSubcaptionSizeClassName(), {\n          [this.styles.subcaptionDisabled(this.theme)]: disabled,\n        })}\n      >\n        {this.props.comment}\n      </div>\n    );\n  }\n\n  private handleFocus = (e: React.FocusEvent<any>) => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      this.globalObject.requestAnimationFrame?.(() => {\n        if (this.keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n\n      if (this.props.onFocus) {\n        this.props.onFocus(e);\n      }\n    }\n  };\n\n  private resetFocus = () => this.setState({ focusedByTab: false });\n\n  private handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    this.resetFocus();\n    this.props.onBlur?.(e);\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const checked = event.currentTarget.checked;\n    this.props.onValueChange?.(checked);\n\n    this.resetIndeterminate();\n\n    this.props.onChange?.(event);\n  };\n\n  private handleLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n    const handleModifierClickInFirefox = fixFirefoxModifiedClickOnLabel(this.input);\n    handleModifierClickInFirefox(e);\n    if (this.props.onClick && e.target !== this.input.current) {\n      e.stopPropagation();\n    }\n  };\n\n  private handleInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n    this.props.onClick?.(e);\n  };\n}\n"]}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["Checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AAClF,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,oDAAoD,CAAC;AACpG,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,8BAA8B,EAAE,MAAM,0CAA0C,CAAC;AAG1F,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAGjE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAsD3D,MAAM,CAAC,IAAM,gBAAgB,GAAG;IAC9B,IAAI,EAAE,gBAAgB;CACd,CAAC;AAEX;;GAEG;AAIH;IAA8B,4BAAiD;IAA/E;;QAwES,WAAK,GAAG;YACb,YAAY,EAAE,KAAK;YACnB,aAAa,EAAE,KAAI,CAAC,KAAK,CAAC,oBAAoB,IAAI,KAAK;YACvD,cAAc,EAAE,KAAK;SACtB,CAAC;QAOM,WAAK,GAAG,KAAK,CAAC,SAAS,EAAoB,CAAC;QAC5C,cAAQ,GAAG,iBAAiB,CAAC,EAAE,CAAC,CAAC;QAGjC,sBAAgB,GAAG,UAAC,CAAgB;YAC1C,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;gBACtB,KAAI,CAAC,QAAQ,CAAC,cAAM,OAAA,CAAC;oBACnB,cAAc,EAAE,IAAI;iBACrB,CAAC,EAFkB,CAElB,CAAC,CAAC;YACN,CAAC;QACH,CAAC,CAAC;QAEM,wBAAkB,GAAG,UAAC,CAAgB;YAC5C,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;gBACtB,KAAI,CAAC,QAAQ,CAAC;oBACZ,cAAc,EAAE,KAAK;iBACtB,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEK,uBAAiB,GAAG;;YACzB,KAAI,CAAC,WAAW,GAAG,IAAI,WAAW,CAAC,KAAI,CAAC,YAAY,CAAC,CAAC;YACtD,IAAI,KAAI,CAAC,KAAK,CAAC,aAAa,IAAI,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBACnD,KAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,GAAG,IAAI,CAAC;YAC1C,CAAC;YAED,MAAA,KAAI,CAAC,YAAY,CAAC,QAAQ,0CAAE,gBAAgB,CAAC,SAAS,EAAE,KAAI,CAAC,gBAAgB,CAAC,CAAC;YAC/E,MAAA,KAAI,CAAC,YAAY,CAAC,QAAQ,0CAAE,gBAAgB,CAAC,OAAO,EAAE,KAAI,CAAC,kBAAkB,CAAC,CAAC;QACjF,CAAC,CAAC;QAEK,0BAAoB,GAAG;;YAC5B,MAAA,KAAI,CAAC,YAAY,CAAC,QAAQ,0CAAE,mBAAmB,CAAC,SAAS,EAAE,KAAI,CAAC,gBAAgB,CAAC,CAAC;YAClF,MAAA,KAAI,CAAC,YAAY,CAAC,QAAQ,0CAAE,mBAAmB,CAAC,OAAO,EAAE,KAAI,CAAC,kBAAkB,CAAC,CAAC;QACpF,CAAC,CAAC;QA6CF;;;WAGG;QACI,sBAAgB,GAAG;YACxB,KAAI,CAAC,QAAQ,CAAC;gBACZ,aAAa,EAAE,IAAI;aACpB,CAAC,CAAC;YACH,IAAI,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBACvB,KAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,GAAG,IAAI,CAAC;YAC1C,CAAC;QACH,CAAC,CAAC;QAEF;;;WAGG;QACI,wBAAkB,GAAG;YAC1B,KAAI,CAAC,QAAQ,CAAC;gBACZ,aAAa,EAAE,KAAK;aACrB,CAAC,CAAC;YACH,IAAI,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBACvB,KAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,GAAG,KAAK,CAAC;YAC3C,CAAC;QACH,CAAC,CAAC;QAEM,gBAAU,GAAG,UAAC,KAA4C;;YAE9D,IAAA,KAAK,GAcH,KAAK,MAdF,EACL,OAAO,GAaL,KAAK,QAbA,EACP,IAAI,GAYF,KAAK,KAZH,EACJ,YAAY,GAWV,KAAK,aAXK,EACZ,YAAY,GAUV,KAAK,aAVK,EACZ,WAAW,GAST,KAAK,YATI,EACX,aAAa,GAQX,KAAK,cARM,EACb,OAAO,GAOL,KAAK,QAPA,EACP,IAAI,GAMF,KAAK,KANH,EACJ,oBAAoB,GAKlB,KAAK,qBALa,EACpB,OAAO,GAIL,KAAK,QAJA,EACa,eAAe,GAGjC,KAAK,oBAH4B,EACrB,SAAS,GAErB,KAAK,cAFgB,EACpB,IAAI,UACL,KAAK,EAfH,oLAeL,CADQ,CACC;YACV,IAAM,eAAe,GAAG,KAAI,CAAC,KAAK,CAAC,aAAa,CAAC;YAEjD,IAAM,SAAS,GAAG,KAAI,CAAC,EAAE,CACvB,KAAI,CAAC,MAAM,CAAC,IAAI,EAAE,EAClB,CAAC,KAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,eAAe,IAAI,KAAI,CAAC,MAAM,CAAC,aAAa,EAAE,CACvE,CAAC;YAEF,IAAM,QAAQ,GAAG,QAAQ,CAAC,KAAI,CAAC,kBAAkB,EAAE,CAAC,CAAC;YACrD,IAAM,SAAS,GAAG,CAChB,8BAAM,SAAS,EAAE,SAAS;gBACxB,oBAAC,WAAW,IAAC,IAAI,EAAE,QAAQ,GAAI,CAC1B,CACR,CAAC;YACF,IAAM,UAAU,GAAG,CACjB,8BAAM,SAAS,EAAE,SAAS;gBACxB,oBAAC,iBAAiB,IAAC,IAAI,EAAE,QAAQ,GAAI,CAChC,CACR,CAAC;YAEF,IAAM,SAAS,GAAG,KAAI,CAAC,EAAE,CAAC,KAAI,CAAC,oBAAoB,EAAE;gBACnD,GAAC,KAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAG,IAAI;gBAC1B,GAAC,KAAI,CAAC,MAAM,CAAC,WAAW,EAAE,IAAG,KAAK,CAAC,OAAO,IAAI,eAAe;gBAC7D,GAAC,KAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,cAAc;gBAChE,GAAC,KAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAG,OAAO,CAAC,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;oBACtD,CAAC;YAEH,IAAM,UAAU,yBACX,IAAI,KACP,IAAI,EAAE,UAAU,EAChB,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,KAAK,EAAE,EAC9B,QAAQ,EAAE,KAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,KAAI,CAAC,WAAW,EACzB,MAAM,EAAE,KAAI,CAAC,UAAU,EACvB,OAAO,EAAE,KAAI,CAAC,gBAAgB,EAC9B,GAAG,EAAE,KAAI,CAAC,KAAK,GAChB,CAAC;YAEF,IAAM,GAAG,GAAG,CACV,6BACE,SAAS,EAAE,KAAI,CAAC,EAAE,CAChB,KAAI,CAAC,0BAA0B,EAAE;oBAE/B,GAAC,KAAI,CAAC,MAAM,CAAC,UAAU,EAAE,IAAG,IAAI;yBAElC,KAAI,CAAC,0CAA0C,EAAE,CAClD;gBAED,6BACE,SAAS,EAAE,KAAI,CAAC,EAAE,CAAC,KAAI,CAAC,MAAM,CAAC,GAAG,EAAE,EAAE,aAAa,CAAC,GAAG;wBACrD,GAAC,KAAI,CAAC,MAAM,CAAC,UAAU,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,OAAO,IAAI,eAAe;wBACjE,GAAC,KAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,YAAY;wBACjD,GAAC,KAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,KAAK;wBAC1C,GAAC,KAAI,CAAC,MAAM,CAAC,UAAU,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,OAAO;wBAC9C,GAAC,KAAI,CAAC,MAAM,CAAC,WAAW,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,QAAQ;4BAChD,IAED,CAAC,eAAe,IAAI,UAAU,CAAC,IAAI,SAAS,CACzC,CACF,CACP,CAAC;YAEF,OAAO,CACL,2CACY,gBAAgB,CAAC,IAAI,EAC/B,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,KAAI,CAAC,gBAAgB;gBAE9B,oBAAC,mBAAmB,IAAC,kBAAkB,EAAE,KAAI,CAAC,UAAU;oBACtD,0CAAW,UAAU,kBAAc,SAAS,sBAAoB,eAAe,IAAI,CAC/D;gBACrB,GAAG;gBACH,KAAI,CAAC,KAAK,CAAC,QAAQ;oBAClB,CAAC,OAAO,CAAC,CAAC,CAAC,CACT,6BAAK,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,cAAc,EAAE;wBACzC,KAAI,CAAC,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC;wBACjD,KAAI,CAAC,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CACxC,CACP,CAAC,CAAC,CAAC,CACF,KAAI,CAAC,aAAa,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CACnD,CAAC,CACE,CACT,CAAC;QACJ,CAAC,CAAC;QAoCM,iBAAW,GAAG,UAAC,CAAwB;;YAC7C,IAAI,CAAC,KAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;gBACzB,iDAAiD;gBACjD,6CAA6C;gBAC7C,MAAA,MAAA,KAAI,CAAC,YAAY,EAAC,qBAAqB,mDAAG;oBACxC,IAAI,KAAI,CAAC,WAAW,CAAC,YAAY,EAAE,CAAC;wBAClC,KAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC,CAAC;oBACxC,CAAC;gBACH,CAAC,CAAC,CAAC;gBAEH,IAAI,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;oBACvB,KAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;gBACxB,CAAC;YACH,CAAC;QACH,CAAC,CAAC;QAEM,gBAAU,GAAG,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,EAAtC,CAAsC,CAAC;QAE1D,gBAAU,GAAG,UAAC,CAAqC;;YACzD,KAAI,CAAC,UAAU,EAAE,CAAC;YAClB,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,MAAM,mDAAG,CAAC,CAAC,CAAC;QACzB,CAAC,CAAC;QAEM,kBAAY,GAAG,UAAC,KAA0C;;YAChE,IAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC;YAC5C,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,aAAa,mDAAG,OAAO,CAAC,CAAC;YAEpC,KAAI,CAAC,kBAAkB,EAAE,CAAC;YAE1B,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,QAAQ,mDAAG,KAAK,CAAC,CAAC;QAC/B,CAAC,CAAC;QAEM,sBAAgB,GAAG,UAAC,CAAqC;YAC/D,IAAM,4BAA4B,GAAG,8BAA8B,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;YAChF,4BAA4B,CAAC,CAAC,CAAC,CAAC;YAChC,IAAI,KAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,KAAK,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBAC1D,CAAC,CAAC,eAAe,EAAE,CAAC;YACtB,CAAC;QACH,CAAC,CAAC;QAEM,sBAAgB,GAAG,UAAC,CAAqC;;YAC/D,MAAA,MAAA,KAAI,CAAC,KAAK,EAAC,OAAO,mDAAG,CAAC,CAAC,CAAC;QAC1B,CAAC,CAAC;;IACJ,CAAC;IA5WS,uCAAoB,GAA5B;QACE,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;YACjC,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;YAClC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;QACnC,CAAC;IACH,CAAC;IAEO,6CAA0B,GAAlC;QACE,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,MAAM,CAAC,eAAe,EAAE,CAAC;YACvC,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE,CAAC;YACxC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,IAAI,CAAC,MAAM,CAAC,eAAe,EAAE,CAAC;QACzC,CAAC;IACH,CAAC;IAEO,sCAAmB,GAA3B;QACE,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;YAC1C,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC;YAC3C,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;QAC5C,CAAC;IACH,CAAC;IAED;;;;;OAKG;IACK,6DAA0C,GAAlD;QACE,QAAQ,8BAA8B,CAAC,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAC,EAAE,CAAC;YAC7E,KAAK,YAAY;gBACf,OAAO,IAAI,CAAC,MAAM,CAAC,wCAAwC,EAAE,CAAC;YAChE,KAAK,WAAW;gBACd,OAAO,IAAI,CAAC,MAAM,CAAC,uCAAuC,EAAE,CAAC;YAC/D,KAAK,WAAW;gBACd,OAAO,IAAI,CAAC,MAAM,CAAC,uCAAuC,EAAE,CAAC;YAC/D,KAAK,MAAM,CAAC;YACZ;gBACE,OAAO,SAAS,CAAC;QACrB,CAAC;IACH,CAAC;IAEO,qCAAkB,GAA1B;QACE,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC;YACzC,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;YAC1C,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC;QAC3C,CAAC;IACH,CAAC;IAmDM,qCAAkB,GAAzB,UAA0B,SAAwB;QAChD,IAAI,SAAS,CAAC,OAAO,KAAK,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;YAC7C,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;IACH,CAAC;IAEM,yBAAM,GAAb;QAAA,iBAeC;QAdC,IAAI,CAAC,MAAM,GAAG,SAAS,EAAE,CAAC;QAE1B,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK;YACL,KAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,KAAI,CAAC,WAAW,IAAM,KAAI,CAAC,QAAQ,EAAE,GAC9D,KAAI,CAAC,UAAU,CACF,CACjB,CAAC;QACJ,CAAC,CACqB,CACzB,CAAC;IACJ,CAAC;IAED;;;OAGG;IACI,wBAAK,GAAZ;;QACE,IAAI,CAAC,WAAW,CAAC,YAAY,GAAG,IAAI,CAAC;QACrC,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IAC9B,CAAC;IAED;;;OAGG;IACI,uBAAI,GAAX;;QACE,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;IAC7B,CAAC;IAoIO,6CAA0B,GAAlC;QACE,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,MAAM,CAAC,eAAe,EAAE,CAAC;YACvC,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE,CAAC;YACxC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,IAAI,CAAC,MAAM,CAAC,eAAe,EAAE,CAAC;QACzC,CAAC;IACH,CAAC;IAEO,gCAAa,GAArB,UAAsB,QAAiB,EAAE,KAAc;;QACrD,IAAM,YAAY,GAAG,IAAI,CAAC,EAAE;YAC1B,GAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAG,IAAI;YAC7B,GAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAG,QAAQ;YAClC,GAAC,IAAI,CAAC,MAAM,CAAC,YAAY,EAAE,IAAG,KAAK;gBACnC,CAAC;QAEH,OAAO,6BAAK,SAAS,EAAE,YAAY,IAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAO,CAAC;IACnE,CAAC;IAEO,gCAAa,GAArB,UAAsB,QAAiB;;QACrC,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,0BAA0B,EAAE;gBAC5E,GAAC,IAAI,CAAC,MAAM,CAAC,kBAAkB,EAAE,IAAG,QAAQ;oBAC5C,IAED,IAAI,CAAC,KAAK,CAAC,OAAO,CACf,CACP,CAAC;IACJ,CAAC;IAlUa,4BAAmB,GAAG,UAAU,AAAb,CAAc;IACjC,oBAAW,GAAG,UAAU,AAAb,CAAc;IAF5B,QAAQ;QAHpB,qBAAqB;QACrB,QAAQ;QACR,QAAQ;OACI,QAAQ,CAgXpB;IAAD,eAAC;CAAA,AAhXD,CAA8B,KAAK,CAAC,aAAa,GAgXhD;SAhXY,QAAQ","sourcesContent":["import type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { FocusControlWrapper } from '../../internal/FocusControlWrapper/index.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { fixFirefoxModifiedClickOnLabel } from '../../lib/events/fixFirefoxModifiedClickOnLabel.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { withSize } from '../../lib/size/SizeDecorator.js';\nimport { getBaselineCompensationVariant } from '../../lib/styles/baselineCompensation.js';\nimport type { ClassNames } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport type { Override } from '../../typings/utility-types.js';\nimport { getStyles, globalClasses } from './Checkbox.styles.js';\nimport { CheckedIcon } from './CheckedIcon.js';\nimport { IndeterminateIcon } from './IndeterminateIcon.js';\n\nexport interface CheckboxProps\n  extends\n    CommonProps,\n    Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>,\n    Override<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      {\n        /** @ignore */\n        children?: React.ReactNode;\n\n        /** Переводит контрол в состояние ошибки. */\n        error?: boolean;\n\n        /** Переводит контрол в состояние предупреждения. */\n        warning?: boolean;\n\n        /** Размер чекбокса. */\n        size?: SizeProp;\n\n        /** HTML-событие `onmouseenter`.\n         * @ignore */\n        onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** HTML-событие `onmouseleave`.\n         * @ignore */\n        onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** HTML-событие `onmouseover`.\n         * @ignore */\n        onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n\n        /** Событие изменения value. */\n        onValueChange?: (value: boolean) => void;\n\n        /** HTML-событие `onblur`.\n         * @ignore */\n        onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n\n        /** Устанавливает начальное [неопределенное состояние чекбокса](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#attr-indeterminate). */\n        initialIndeterminate?: boolean;\n\n        /** Задаёт второстепенный пояснительный текст под основным текстом чекбокса. */\n        comment?: React.ReactNode;\n      }\n    > {}\n\nexport interface CheckboxState {\n  focusedByTab: boolean;\n  indeterminate: boolean;\n  isShiftPressed: boolean;\n}\n\nexport const CheckboxDataTids = {\n  root: 'Checkbox__root',\n} as const;\n\n/**\n * Чекбокс используется для управления параметром с двумя состояниями.\n */\n@withRenderEnvironment\n@rootNode\n@withSize\nexport class Checkbox extends React.PureComponent<CheckboxProps, CheckboxState> {\n  public static __KONTUR_REACT_UI__ = 'Checkbox';\n  public static displayName = 'Checkbox';\n\n  private getRootSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.rootLarge();\n      case 'medium':\n        return this.styles.rootMedium();\n      case 'small':\n      default:\n        return this.styles.rootSmall();\n    }\n  }\n\n  private getBoxWrapperSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.boxWrapperLarge();\n      case 'medium':\n        return this.styles.boxWrapperMedium();\n      case 'small':\n      default:\n        return this.styles.boxWrapperSmall();\n    }\n  }\n\n  private getCheckboxFontSize() {\n    switch (this.size) {\n      case 'large':\n        return this.theme.checkboxFontSizeLarge;\n      case 'medium':\n        return this.theme.checkboxFontSizeMedium;\n      case 'small':\n      default:\n        return this.theme.checkboxFontSizeSmall;\n    }\n  }\n\n  /**\n   * Ветвление компенсации базовой линии немонотонно (на 17px компенсации нет) и\n   * в `calc()` не выражается, поэтому размер шрифта читается из темы здесь, а в\n   * разметку уходит один из готовых статических классов. Класс идёт в `cx`\n   * после размерного и перебивает его `margin-top`.\n   */\n  private getBoxWrapperBaselineCompensationClassName() {\n    switch (getBaselineCompensationVariant(parseInt(this.getCheckboxFontSize()))) {\n      case 'lessThan16':\n        return this.styles.boxWrapperBaselineCompensationLessThan16();\n      case 'exactly16':\n        return this.styles.boxWrapperBaselineCompensationExactly16();\n      case 'exactly18':\n        return this.styles.boxWrapperBaselineCompensationExactly18();\n      case 'none':\n      default:\n        return undefined;\n    }\n  }\n\n  private getCheckboxBoxSize() {\n    switch (this.size) {\n      case 'large':\n        return this.theme.checkboxBoxSizeLarge;\n      case 'medium':\n        return this.theme.checkboxBoxSizeMedium;\n      case 'small':\n      default:\n        return this.theme.checkboxBoxSizeSmall;\n    }\n  }\n\n  public state = {\n    focusedByTab: false,\n    indeterminate: this.props.initialIndeterminate || false,\n    isShiftPressed: false,\n  };\n  private size!: SizeProp;\n\n  private globalObject!: GlobalObject;\n  private cx!: ClassNames;\n  private styles!: ReturnType<typeof getStyles>;\n  private theme!: Theme;\n  private input = React.createRef<HTMLInputElement>();\n  private getProps = createPropsGetter({});\n  private keyListener!: KeyListener;\n\n  private handleShiftPress = (e: KeyboardEvent) => {\n    if (e.key === 'Shift') {\n      this.setState(() => ({\n        isShiftPressed: true,\n      }));\n    }\n  };\n\n  private handleShiftRelease = (e: KeyboardEvent) => {\n    if (e.key === 'Shift') {\n      this.setState({\n        isShiftPressed: false,\n      });\n    }\n  };\n\n  public componentDidMount = () => {\n    this.keyListener = new KeyListener(this.globalObject);\n    if (this.state.indeterminate && this.input.current) {\n      this.input.current.indeterminate = true;\n    }\n\n    this.globalObject.document?.addEventListener('keydown', this.handleShiftPress);\n    this.globalObject.document?.addEventListener('keyup', this.handleShiftRelease);\n  };\n\n  public componentWillUnmount = () => {\n    this.globalObject.document?.removeEventListener('keydown', this.handleShiftPress);\n    this.globalObject.document?.removeEventListener('keyup', this.handleShiftRelease);\n  };\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidUpdate(prevProps: CheckboxProps) {\n    if (prevProps.checked !== this.props.checked) {\n      this.resetIndeterminate();\n    }\n  }\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles();\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * Программно устанавливает фокус на чекбокс.\n   * @public\n   */\n  public focus(): void {\n    this.keyListener.isTabPressed = true;\n    this.input.current?.focus();\n  }\n\n  /**\n   * Программно снимает фокус с чекбокса.\n   * @public\n   */\n  public blur(): void {\n    this.input.current?.blur();\n  }\n\n  /**\n   * Устанавливает чекбокс в HTML-состояние `indeterminate`.\n   * @public\n   */\n  public setIndeterminate = (): void => {\n    this.setState({\n      indeterminate: true,\n    });\n    if (this.input.current) {\n      this.input.current.indeterminate = true;\n    }\n  };\n\n  /**\n   * Снимает с чекбокса HTML-состояние `indeterminate`.\n   * @public\n   */\n  public resetIndeterminate = (): void => {\n    this.setState({\n      indeterminate: false,\n    });\n    if (this.input.current) {\n      this.input.current.indeterminate = false;\n    }\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<CheckboxProps>) => {\n    const {\n      error,\n      warning,\n      size,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onValueChange,\n      onClick,\n      type,\n      initialIndeterminate,\n      comment,\n      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n      ...rest\n    } = props;\n    const isIndeterminate = this.state.indeterminate;\n\n    const iconClass = this.cx(\n      this.styles.icon(),\n      !this.props.checked && !isIndeterminate && this.styles.iconUnchecked(),\n    );\n\n    const iconSize = parseInt(this.getCheckboxBoxSize());\n    const IconCheck = (\n      <span className={iconClass}>\n        <CheckedIcon size={iconSize} />\n      </span>\n    );\n    const IconSquare = (\n      <span className={iconClass}>\n        <IndeterminateIcon size={iconSize} />\n      </span>\n    );\n\n    const rootClass = this.cx(this.getRootSizeClassName(), {\n      [this.styles.root()]: true,\n      [this.styles.rootChecked()]: props.checked || isIndeterminate,\n      [this.styles.rootDisableTextSelect()]: this.state.isShiftPressed,\n      [this.styles.disabled()]: Boolean(this.props.disabled),\n    });\n\n    const inputProps = {\n      ...rest,\n      type: 'checkbox',\n      className: this.styles.input(),\n      onChange: this.handleChange,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      onClick: this.handleInputClick,\n      ref: this.input,\n    };\n\n    const box = (\n      <div\n        className={this.cx(\n          this.getBoxWrapperSizeClassName(),\n          {\n            [this.styles.boxWrapper()]: true,\n          },\n          this.getBoxWrapperBaselineCompensationClassName(),\n        )}\n      >\n        <div\n          className={this.cx(this.styles.box(), globalClasses.box, {\n            [this.styles.boxChecked()]: this.props.checked || isIndeterminate,\n            [this.styles.boxFocus()]: this.state.focusedByTab,\n            [this.styles.boxError()]: this.props.error,\n            [this.styles.boxWarning()]: this.props.warning,\n            [this.styles.boxDisabled()]: this.props.disabled,\n          })}\n        >\n          {(isIndeterminate && IconSquare) || IconCheck}\n        </div>\n      </div>\n    );\n\n    return (\n      <label\n        data-tid={CheckboxDataTids.root}\n        className={rootClass}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        onMouseOver={onMouseOver}\n        onClick={this.handleLabelClick}\n      >\n        <FocusControlWrapper onBlurWhenDisabled={this.resetFocus}>\n          <input {...inputProps} aria-label={ariaLabel} aria-describedby={ariaDescribedby} />\n        </FocusControlWrapper>\n        {box}\n        {this.props.children &&\n          (comment ? (\n            <div className={this.styles.captionWrapper()}>\n              {this.renderCaption(Boolean(props.disabled), true)}\n              {this.renderComment(Boolean(props.disabled))}\n            </div>\n          ) : (\n            this.renderCaption(Boolean(props.disabled), false)\n          ))}\n      </label>\n    );\n  };\n\n  private getSubcaptionSizeClassName() {\n    switch (this.size) {\n      case 'large':\n        return this.styles.subcaptionLarge();\n      case 'medium':\n        return this.styles.subcaptionMedium();\n      case 'small':\n      default:\n        return this.styles.subcaptionSmall();\n    }\n  }\n\n  private renderCaption(disabled: boolean, noGap: boolean) {\n    const captionClass = this.cx({\n      [this.styles.caption()]: true,\n      [this.styles.disabled()]: disabled,\n      [this.styles.captionNoGap()]: noGap,\n    });\n\n    return <div className={captionClass}>{this.props.children}</div>;\n  }\n\n  private renderComment(disabled: boolean) {\n    return (\n      <div\n        className={this.cx(this.styles.subcaption(), this.getSubcaptionSizeClassName(), {\n          [this.styles.subcaptionDisabled()]: disabled,\n        })}\n      >\n        {this.props.comment}\n      </div>\n    );\n  }\n\n  private handleFocus = (e: React.FocusEvent<any>) => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      this.globalObject.requestAnimationFrame?.(() => {\n        if (this.keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n\n      if (this.props.onFocus) {\n        this.props.onFocus(e);\n      }\n    }\n  };\n\n  private resetFocus = () => this.setState({ focusedByTab: false });\n\n  private handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    this.resetFocus();\n    this.props.onBlur?.(e);\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const checked = event.currentTarget.checked;\n    this.props.onValueChange?.(checked);\n\n    this.resetIndeterminate();\n\n    this.props.onChange?.(event);\n  };\n\n  private handleLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n    const handleModifierClickInFirefox = fixFirefoxModifiedClickOnLabel(this.input);\n    handleModifierClickInFirefox(e);\n    if (this.props.onClick && e.target !== this.input.current) {\n      e.stopPropagation();\n    }\n  };\n\n  private handleInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n    this.props.onClick?.(e);\n  };\n}\n"]}

package/components/Checkbox/Checkbox.styles.d.ts

@@ -1,34 +1,37 @@
-import type { Theme } from '../../lib/theming/Theme.js';
 export declare const globalClasses: {
     box: string;
 };
-export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
-    root(t: Theme): string;
-    rootSmall(t: Theme): string;
-    rootMedium(t: Theme): string;
-    rootLarge(t: Theme): string;
-    rootDisableTextSelect(): string;
-    rootChecked(t: Theme): string;
-    boxWrapper(t: Theme): string;
-    boxWrapperSmall(t: Theme): string;
-    boxWrapperMedium(t: Theme): string;
-    boxWrapperLarge(t: Theme): string;
-    box(t: Theme): string;
-    input(): string;
-    boxWarning(t: Theme): string;
-    boxError(t: Theme): string;
-    boxChecked(t: Theme): string;
-    boxFocus(t: Theme): string;
-    boxDisabled(t: Theme): string;
-    disabled(t: Theme): string;
-    icon(): string;
-    iconUnchecked(): string;
-    caption(t: Theme): string;
-    captionWrapper(t: Theme): string;
-    captionNoGap(): string;
-    subcaption(t: Theme): string;
-    subcaptionDisabled(t: Theme): string;
-    subcaptionSmall(t: Theme): string;
-    subcaptionMedium(t: Theme): string;
-    subcaptionLarge(t: Theme): string;
+/** Правила — в `Checkbox.css`; здесь только имена классов. */
+export declare const getStyles: (ignored?: unknown) => import("../../lib/theming/staticStyles.js").StaticStyles<{
+    root: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    rootDisableTextSelect: string;
+    rootChecked: string;
+    boxWrapper: string;
+    boxWrapperSmall: string;
+    boxWrapperMedium: string;
+    boxWrapperLarge: string;
+    boxWrapperBaselineCompensationLessThan16: string;
+    boxWrapperBaselineCompensationExactly16: string;
+    boxWrapperBaselineCompensationExactly18: string;
+    box: string;
+    input: string;
+    boxWarning: string;
+    boxError: string;
+    boxChecked: string;
+    boxFocus: string;
+    icon: string;
+    iconUnchecked: string;
+    caption: string;
+    captionWrapper: string;
+    captionNoGap: string;
+    subcaption: string;
+    subcaptionDisabled: string;
+    subcaptionSmall: string;
+    subcaptionMedium: string;
+    subcaptionLarge: string;
+    disabled: string;
+    boxDisabled: string;
 }>;

package/components/Checkbox/Checkbox.styles.js

@@ -1,100 +1,40 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { memoizeGetStyles, prefix } from '../../lib/theming/Emotion.js';
-import { boxWrapperSizeMixin, checkboxSizeMixin, disabledTextColorMixin, subcaptionMixin } from './Checkbox.mixins.js';
+import { prefix } from '../../lib/theming/Emotion.js';
+import { staticStyles } from '../../lib/theming/staticStyles.js';
 export var globalClasses = prefix('checkbox')({
     box: 'box',
 });
-export var getStyles = memoizeGetStyles(function (_a) {
-    var css = _a.css;
-    return ({
-        root: function (t) {
-            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      display: inline-flex;\n      align-items: baseline;\n      cursor: pointer;\n      position: relative;\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned box,\n        // and also height and baseline for checkbox without caption.\n        content: '\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n\n      .", " {\n        transition:\n          background ", " ", ",\n          box-shadow ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &:active .", " {\n        box-shadow: ", ";\n        background: ", ";\n      }\n    "], ["\n      display: inline-flex;\n      align-items: baseline;\n      cursor: pointer;\n      position: relative;\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned box,\n        // and also height and baseline for checkbox without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n\n      .", " {\n        transition:\n          background ", " ", ",\n          box-shadow ", " ", ";\n      }\n\n      &:hover .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n\n      &:active .", " {\n        box-shadow: ", ";\n        background: ", ";\n      }\n    "])), globalClasses.box, t.transitionDuration, t.transitionTimingFunction, t.transitionDuration, t.transitionTimingFunction, globalClasses.box, t.checkboxHoverBg, t.checkboxShadowHover, globalClasses.box, t.checkboxShadowActive, t.checkboxActiveBg);
-        },
-        rootSmall: function (t) {
-            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), checkboxSizeMixin(t.checkboxFontSizeSmall, t.checkboxLineHeightSmall, t.checkboxPaddingYSmall, t.checkboxBoxSizeSmall, t.checkboxPaddingXSmall));
-        },
-        rootMedium: function (t) {
-            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), checkboxSizeMixin(t.checkboxFontSizeMedium, t.checkboxLineHeightMedium, t.checkboxPaddingYMedium, t.checkboxBoxSizeMedium, t.checkboxPaddingXMedium));
-        },
-        rootLarge: function (t) {
-            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), checkboxSizeMixin(t.checkboxFontSizeLarge, t.checkboxLineHeightLarge, t.checkboxPaddingYLarge, t.checkboxBoxSizeLarge, t.checkboxPaddingXLarge));
-        },
-        rootDisableTextSelect: function () {
-            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      user-select: none;\n    "], ["\n      user-select: none;\n    "])));
-        },
-        rootChecked: function (t) {
-            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      &:hover .", " {\n        box-shadow: ", ";\n        background: ", ";\n      }\n\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n    "], ["\n      &:hover .", " {\n        box-shadow: ", ";\n        background: ", ";\n      }\n\n      &:active .", " {\n        background: ", ";\n        box-shadow: ", ";\n      }\n    "])), globalClasses.box, t.checkboxCheckedHoverShadow, t.checkboxCheckedHoverBg, globalClasses.box, t.checkboxCheckedActiveBg, t.checkboxCheckedActiveShadow);
-        },
-        boxWrapper: function (t) {
-            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      position: absolute;\n      box-sizing: border-box;\n      padding: ", ";\n\n      display: inline-block;        \n    )};\n    "], ["\n      position: absolute;\n      box-sizing: border-box;\n      padding: ", ";\n\n      display: inline-block;        \n    )};\n    "])), t.checkboxBorderWidth);
-        },
-        boxWrapperSmall: function (t) {
-            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), boxWrapperSizeMixin(t.labGrotesqueBaselineCompensation, t.checkboxFontSizeSmall, t.checkboxBoxSizeSmall, t.checkboxBoxOffsetY, t.checkboxPaddingXSmall));
-        },
-        boxWrapperMedium: function (t) {
-            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), boxWrapperSizeMixin(t.labGrotesqueBaselineCompensation, t.checkboxFontSizeMedium, t.checkboxBoxSizeMedium, t.checkboxBoxOffsetY, t.checkboxPaddingXMedium));
-        },
-        boxWrapperLarge: function (t) {
-            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), boxWrapperSizeMixin(t.labGrotesqueBaselineCompensation, t.checkboxFontSizeLarge, t.checkboxBoxSizeLarge, t.checkboxBoxOffsetY, t.checkboxPaddingXLarge));
-        },
-        box: function (t) {
-            return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      color: ", ";\n      box-shadow: ", ";\n      background: ", ";\n      border-radius: ", ";\n      height: 100%;\n    "], ["\n      color: ", ";\n      box-shadow: ", ";\n      background: ", ";\n      border-radius: ", ";\n      height: 100%;\n    "])), t.checkboxTextColorDefault, t.checkboxShadow, t.checkboxBg, t.checkboxBorderRadius);
-        },
-        input: function () {
-            return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    "], ["\n      display: inline-block;\n      height: 0;\n      opacity: 0;\n      position: absolute;\n      width: 0;\n      z-index: -1;\n    "])));
-        },
-        boxWarning: function (t) {
-            return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "], ["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorWarning);
-        },
-        boxError: function (t) {
-            return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "], ["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorError);
-        },
-        boxChecked: function (t) {
-            return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n      box-shadow: ", ";\n    "], ["\n      background: ", ";\n      color: ", ";\n      box-shadow: ", ";\n    "])), t.checkboxCheckedBg, t.checkboxCheckedColor, t.checkboxCheckedShadow);
-        },
-        boxFocus: function (t) {
-            return css(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "], ["\n      box-shadow:\n        inset 0 0 0 1px ", ",\n        0 0 0 ", " ", " !important; // override hover and active\n    "])), t.checkboxOutlineColorFocus, t.checkboxOutlineWidth, t.checkboxBorderColorFocus);
-        },
-        boxDisabled: function (t) {
-            return css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n      box-shadow: ", " !important; // override hover and active\n      background: ", " !important; // override hover and active\n      color: ", ";\n    "], ["\n      box-shadow: ", " !important; // override hover and active\n      background: ", " !important; // override hover and active\n      color: ", ";\n    "])), t.checkboxShadowDisabled, t.checkboxBgDisabled, t.checkboxTextColorDisabled);
-        },
-        disabled: function (t) {
-            return css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n      color: ", ";\n      cursor: default;\n    "], ["\n      color: ", ";\n      cursor: default;\n    "])), t.checkboxTextColorDisabled);
-        },
-        icon: function () {
-            return css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    "], ["\n      position: absolute;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    "])));
-        },
-        iconUnchecked: function () {
-            return css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n      color: transparent;\n    "], ["\n      color: transparent;\n    "])));
-        },
-        caption: function (t) {
-            return css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n      color: ", ";\n      padding-left: ", ";\n    "], ["\n      color: ", ";\n      padding-left: ", ";\n    "])), t.checkboxTextColorDefault, t.checkboxCaptionGap);
-        },
-        captionWrapper: function (t) {
-            return css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n      display: inline-block;\n      padding-left: ", ";\n    "], ["\n      display: inline-block;\n      padding-left: ", ";\n    "])), t.checkboxCaptionGap);
-        },
-        captionNoGap: function () {
-            return css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n      padding-left: 0;\n    "], ["\n      padding-left: 0;\n    "])));
-        },
-        subcaption: function (t) {
-            return css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n      margin-top: 2px;\n      color: ", ";\n    "], ["\n      margin-top: 2px;\n      color: ", ";\n    "])), t.checkboxCommentTextColor);
-        },
-        subcaptionDisabled: function (t) {
-            return css(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), disabledTextColorMixin(t.checkboxTextColorDisabled));
-        },
-        subcaptionSmall: function (t) {
-            return css(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), subcaptionMixin(t.checkboxCommentFontSizeSmall, t.checkboxCommentLineHeightSmall));
-        },
-        subcaptionMedium: function (t) {
-            return css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), subcaptionMixin(t.checkboxCommentFontSizeMedium, t.checkboxCommentLineHeightMedium));
-        },
-        subcaptionLarge: function (t) {
-            return css(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), subcaptionMixin(t.checkboxCommentFontSizeLarge, t.checkboxCommentLineHeightLarge));
-        },
-    });
+/** Правила — в `Checkbox.css`; здесь только имена классов. */
+export var getStyles = staticStyles({
+    root: 'react-ui-Checkbox-root',
+    rootSmall: 'react-ui-Checkbox-rootSmall',
+    rootMedium: 'react-ui-Checkbox-rootMedium',
+    rootLarge: 'react-ui-Checkbox-rootLarge',
+    rootDisableTextSelect: 'react-ui-Checkbox-rootDisableTextSelect',
+    rootChecked: 'react-ui-Checkbox-rootChecked',
+    boxWrapper: 'react-ui-Checkbox-boxWrapper',
+    boxWrapperSmall: 'react-ui-Checkbox-boxWrapperSmall',
+    boxWrapperMedium: 'react-ui-Checkbox-boxWrapperMedium',
+    boxWrapperLarge: 'react-ui-Checkbox-boxWrapperLarge',
+    boxWrapperBaselineCompensationLessThan16: 'react-ui-Checkbox-boxWrapperBaselineCompensationLessThan16',
+    boxWrapperBaselineCompensationExactly16: 'react-ui-Checkbox-boxWrapperBaselineCompensationExactly16',
+    boxWrapperBaselineCompensationExactly18: 'react-ui-Checkbox-boxWrapperBaselineCompensationExactly18',
+    box: 'react-ui-Checkbox-box',
+    input: 'react-ui-Checkbox-input',
+    boxWarning: 'react-ui-Checkbox-boxWarning',
+    boxError: 'react-ui-Checkbox-boxError',
+    boxChecked: 'react-ui-Checkbox-boxChecked',
+    boxFocus: 'react-ui-Checkbox-boxFocus',
+    icon: 'react-ui-Checkbox-icon',
+    iconUnchecked: 'react-ui-Checkbox-iconUnchecked',
+    caption: 'react-ui-Checkbox-caption',
+    captionWrapper: 'react-ui-Checkbox-captionWrapper',
+    captionNoGap: 'react-ui-Checkbox-captionNoGap',
+    subcaption: 'react-ui-Checkbox-subcaption',
+    subcaptionDisabled: 'react-ui-Checkbox-subcaptionDisabled',
+    subcaptionSmall: 'react-ui-Checkbox-subcaptionSmall',
+    subcaptionMedium: 'react-ui-Checkbox-subcaptionMedium',
+    subcaptionLarge: 'react-ui-Checkbox-subcaptionLarge',
+    disabled: 'react-ui-Checkbox-disabled',
+    boxDisabled: 'react-ui-Checkbox-boxDisabled',
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28;
 //# sourceMappingURL=Checkbox.styles.js.map