@hh.ru/magritte-ui-checkbox-radio 2.1.4 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/Checkbox.js +6 -2
  2. package/Checkbox.js.map +1 -1
  3. package/{CheckboxSkeleton-933b6df6.js → CheckboxSkeleton-4e6bc72f.js} +2 -2
  4. package/{CheckboxSkeleton-933b6df6.js.map → CheckboxSkeleton-4e6bc72f.js.map} +1 -1
  5. package/CheckboxSkeleton.js +1 -1
  6. package/Radio.js +1 -1
  7. package/{RadioSkeleton-c82f74e6.js → RadioSkeleton-94d4f852.js} +2 -2
  8. package/{RadioSkeleton-c82f74e6.js.map → RadioSkeleton-94d4f852.js.map} +1 -1
  9. package/RadioSkeleton.js +1 -1
  10. package/index.css +106 -59
  11. package/index.js +2 -2
  12. package/package.json +3 -3
package/Checkbox.js CHANGED
@@ -3,7 +3,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import { useRef, useEffect } from 'react';
4
4
  import classnames from 'classnames';
5
5
  import { useDisabled } from '@hh.ru/magritte-common-use-disabled';
6
- import { C as CheckboxSkeleton, s as styles } from './CheckboxSkeleton-933b6df6.js';
6
+ import { C as CheckboxSkeleton, s as styles } from './CheckboxSkeleton-4e6bc72f.js';
7
7
  import { CheckboxLineSize24, CheckboxCheckSize24 } from '@hh.ru/magritte-ui-icon/variants/private';
8
8
  import { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';
9
9
  import '@hh.ru/magritte-common-use-loading-state';
@@ -19,7 +19,11 @@ const CheckboxComponent = ({ disabled, invalid, indeterminate = false, onChange,
19
19
  }, [indeterminate]);
20
20
  return (jsxs("span", { className: styles.checkbox_container, "data-qa": dataQaContainer, children: [jsx("input", { ...props, className: styles.checkbox_input, ref: checkboxRef, readOnly: readOnly, type: "checkbox", "aria-label": ariaLabel, disabled: forceDisabled || !!disabled, onChange: onChange }), jsx("span", { className: classnames(styles.checkbox, {
21
21
  [styles.invalid]: invalid,
22
- }), "data-qa": dataQaCheckbox }), jsx("span", { className: styles.icon_wrapper, children: indeterminate ? jsx(CheckboxLineSize24, {}) : jsx(CheckboxCheckSize24, {}) })] }));
22
+ }), "data-qa": dataQaCheckbox }), jsxs("span", { className: styles.icon_wrapper, children: [jsx("span", { className: classnames(styles.icon, {
23
+ [styles.iconHidden]: !indeterminate,
24
+ }), children: jsx(CheckboxLineSize24, {}) }), jsx("span", { className: classnames(styles.icon, {
25
+ [styles.iconHidden]: indeterminate,
26
+ }), children: jsx(CheckboxCheckSize24, {}) })] })] }));
23
27
  };
24
28
  CheckboxComponent.isCheckbox = true;
25
29
  const Checkbox = enrichWithSkeleton(CheckboxComponent, CheckboxSkeleton);
package/Checkbox.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","sources":["../src/Checkbox.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport classnames from 'classnames';\n\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { FcWithFlag } from '@hh.ru/magritte-types';\nimport { CheckboxSkeleton } from '@hh.ru/magritte-ui-checkbox-radio/CheckboxSkeleton';\nimport { CheckboxProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { CheckboxCheckSize24, CheckboxLineSize24 } from '@hh.ru/magritte-ui-icon/variants/private';\nimport { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './checkbox.less';\n\nconst CheckboxComponent: FcWithFlag<CheckboxProps, 'isCheckbox'> = ({\n disabled,\n invalid,\n indeterminate = false,\n onChange,\n readOnly,\n ariaLabel,\n dataQaContainer = 'checkbox-container',\n dataQaCheckbox = 'checkbox',\n ...props\n}) => {\n const forceDisabled = useDisabled();\n const checkboxRef = useRef<HTMLInputElement>(null);\n useEffect(() => {\n if (!checkboxRef.current) {\n return;\n }\n checkboxRef.current.indeterminate = indeterminate;\n }, [indeterminate]);\n\n return (\n <span className={styles.checkbox_container} data-qa={dataQaContainer}>\n <input\n {...props}\n className={styles.checkbox_input}\n ref={checkboxRef}\n readOnly={readOnly}\n type=\"checkbox\"\n aria-label={ariaLabel}\n disabled={forceDisabled || !!disabled}\n onChange={onChange}\n />\n <span\n className={classnames(styles.checkbox, {\n [styles.invalid]: invalid,\n })}\n data-qa={dataQaCheckbox}\n ></span>\n <span className={styles.icon_wrapper}>\n {indeterminate ? <CheckboxLineSize24 /> : <CheckboxCheckSize24 />}\n </span>\n </span>\n );\n};\n\nCheckboxComponent.isCheckbox = true;\n\nexport const Checkbox = enrichWithSkeleton(CheckboxComponent, CheckboxSkeleton);\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AAYA,MAAM,iBAAiB,GAA4C,CAAC,EAChE,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,KAAK,EACrB,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,eAAe,GAAG,oBAAoB,EACtC,cAAc,GAAG,UAAU,EAC3B,GAAG,KAAK,EACX,KAAI;AACD,IAAA,MAAM,aAAa,GAAG,WAAW,EAAE,CAAC;AACpC,IAAA,MAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;YACtB,OAAO;AACV,SAAA;AACD,QAAA,WAAW,CAAC,OAAO,CAAC,aAAa,GAAG,aAAa,CAAC;AACtD,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,QACIA,IAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,kBAAkB,EAAA,SAAA,EAAW,eAAe,EAAA,QAAA,EAAA,CAChEC,GACQ,CAAA,OAAA,EAAA,EAAA,GAAA,KAAK,EACT,SAAS,EAAE,MAAM,CAAC,cAAc,EAChC,GAAG,EAAE,WAAW,EAChB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,UAAU,EACH,YAAA,EAAA,SAAS,EACrB,QAAQ,EAAE,aAAa,IAAI,CAAC,CAAC,QAAQ,EACrC,QAAQ,EAAE,QAAQ,EACpB,CAAA,EACFA,GACI,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,QAAQ,EAAE;AACnC,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,OAAO;iBAC5B,CAAC,EAAA,SAAA,EACO,cAAc,EAAA,CACnB,EACRA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAC/B,aAAa,GAAGA,GAAC,CAAA,kBAAkB,EAAG,EAAA,CAAA,GAAGA,GAAC,CAAA,mBAAmB,EAAG,EAAA,CAAA,EAAA,CAC9D,CACJ,EAAA,CAAA,EACT;AACN,CAAC,CAAC;AAEF,iBAAiB,CAAC,UAAU,GAAG,IAAI,CAAC;AAEvB,MAAA,QAAQ,GAAG,kBAAkB,CAAC,iBAAiB,EAAE,gBAAgB;;;;"}
1
+ {"version":3,"file":"Checkbox.js","sources":["../src/Checkbox.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport classnames from 'classnames';\n\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { FcWithFlag } from '@hh.ru/magritte-types';\nimport { CheckboxSkeleton } from '@hh.ru/magritte-ui-checkbox-radio/CheckboxSkeleton';\nimport { CheckboxProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { CheckboxCheckSize24, CheckboxLineSize24 } from '@hh.ru/magritte-ui-icon/variants/private';\nimport { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './checkbox.less';\n\nconst CheckboxComponent: FcWithFlag<CheckboxProps, 'isCheckbox'> = ({\n disabled,\n invalid,\n indeterminate = false,\n onChange,\n readOnly,\n ariaLabel,\n dataQaContainer = 'checkbox-container',\n dataQaCheckbox = 'checkbox',\n ...props\n}) => {\n const forceDisabled = useDisabled();\n const checkboxRef = useRef<HTMLInputElement>(null);\n useEffect(() => {\n if (!checkboxRef.current) {\n return;\n }\n checkboxRef.current.indeterminate = indeterminate;\n }, [indeterminate]);\n\n return (\n <span className={styles.checkbox_container} data-qa={dataQaContainer}>\n <input\n {...props}\n className={styles.checkbox_input}\n ref={checkboxRef}\n readOnly={readOnly}\n type=\"checkbox\"\n aria-label={ariaLabel}\n disabled={forceDisabled || !!disabled}\n onChange={onChange}\n />\n <span\n className={classnames(styles.checkbox, {\n [styles.invalid]: invalid,\n })}\n data-qa={dataQaCheckbox}\n ></span>\n <span className={styles.icon_wrapper}>\n <span\n className={classnames(styles.icon, {\n [styles.iconHidden]: !indeterminate,\n })}\n >\n <CheckboxLineSize24 />\n </span>\n <span\n className={classnames(styles.icon, {\n [styles.iconHidden]: indeterminate,\n })}\n >\n <CheckboxCheckSize24 />\n </span>\n </span>\n </span>\n );\n};\n\nCheckboxComponent.isCheckbox = true;\n\nexport const Checkbox = enrichWithSkeleton(CheckboxComponent, CheckboxSkeleton);\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AAYA,MAAM,iBAAiB,GAA4C,CAAC,EAChE,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,KAAK,EACrB,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,eAAe,GAAG,oBAAoB,EACtC,cAAc,GAAG,UAAU,EAC3B,GAAG,KAAK,EACX,KAAI;AACD,IAAA,MAAM,aAAa,GAAG,WAAW,EAAE,CAAC;AACpC,IAAA,MAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;YACtB,OAAO;AACV,SAAA;AACD,QAAA,WAAW,CAAC,OAAO,CAAC,aAAa,GAAG,aAAa,CAAC;AACtD,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,QACIA,IAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,kBAAkB,EAAA,SAAA,EAAW,eAAe,EAAA,QAAA,EAAA,CAChEC,GACQ,CAAA,OAAA,EAAA,EAAA,GAAA,KAAK,EACT,SAAS,EAAE,MAAM,CAAC,cAAc,EAChC,GAAG,EAAE,WAAW,EAChB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,UAAU,EACH,YAAA,EAAA,SAAS,EACrB,QAAQ,EAAE,aAAa,IAAI,CAAC,CAAC,QAAQ,EACrC,QAAQ,EAAE,QAAQ,EACpB,CAAA,EACFA,GACI,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,QAAQ,EAAE;AACnC,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,OAAO;AAC5B,iBAAA,CAAC,aACO,cAAc,EAAA,CACnB,EACRD,IAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,YAAY,EAChC,QAAA,EAAA,CAAAC,GAAA,CAAA,MAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE;AAC/B,4BAAA,CAAC,MAAM,CAAC,UAAU,GAAG,CAAC,aAAa;AACtC,yBAAA,CAAC,EAEF,QAAA,EAAAA,GAAA,CAAC,kBAAkB,EAAA,EAAA,CAAG,GACnB,EACPA,GAAA,CAAA,MAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE;AAC/B,4BAAA,CAAC,MAAM,CAAC,UAAU,GAAG,aAAa;yBACrC,CAAC,EAAA,QAAA,EAEFA,IAAC,mBAAmB,EAAA,EAAA,CAAG,GACpB,CACJ,EAAA,CAAA,CAAA,EAAA,CACJ,EACT;AACN,CAAC,CAAC;AAEF,iBAAiB,CAAC,UAAU,GAAG,IAAI,CAAC;AAEvB,MAAA,QAAQ,GAAG,kBAAkB,CAAC,iBAAiB,EAAE,gBAAgB;;;;"}
package/{CheckboxSkeleton-933b6df6.js → CheckboxSkeleton-4e6bc72f.js} RENAMED
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
3
3
  import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';
4
4
  import { Skeleton } from '@hh.ru/magritte-ui-skeleton';
5
5
 
6
- var styles = {"checkbox_container":"magritte-checkbox_container___J-wPy_2-1-4","checkboxContainer":"magritte-checkbox_container___J-wPy_2-1-4","checkbox_input":"magritte-checkbox_input___tguDn_2-1-4","checkboxInput":"magritte-checkbox_input___tguDn_2-1-4","checkbox":"magritte-checkbox___xQHy4_2-1-4","icon_wrapper":"magritte-icon_wrapper___k96d9_2-1-4","iconWrapper":"magritte-icon_wrapper___k96d9_2-1-4","invalid":"magritte-invalid___6k7qT_2-1-4","checkbox-skeleton-container":"magritte-checkbox-skeleton-container___4uNYP_2-1-4","checkboxSkeletonContainer":"magritte-checkbox-skeleton-container___4uNYP_2-1-4","checkbox-skeleton":"magritte-checkbox-skeleton___uo6u7_2-1-4","checkboxSkeleton":"magritte-checkbox-skeleton___uo6u7_2-1-4"};
6
+ var styles = {"checkbox_container":"magritte-checkbox_container___J-wPy_2-2-0","checkboxContainer":"magritte-checkbox_container___J-wPy_2-2-0","checkbox_input":"magritte-checkbox_input___tguDn_2-2-0","checkboxInput":"magritte-checkbox_input___tguDn_2-2-0","checkbox":"magritte-checkbox___xQHy4_2-2-0","icon_wrapper":"magritte-icon_wrapper___k96d9_2-2-0","iconWrapper":"magritte-icon_wrapper___k96d9_2-2-0","invalid":"magritte-invalid___6k7qT_2-2-0","checkbox-skeleton-container":"magritte-checkbox-skeleton-container___4uNYP_2-2-0","checkboxSkeletonContainer":"magritte-checkbox-skeleton-container___4uNYP_2-2-0","checkbox-skeleton":"magritte-checkbox-skeleton___uo6u7_2-2-0","checkboxSkeleton":"magritte-checkbox-skeleton___uo6u7_2-2-0","icon":"magritte-icon___q1TLo_2-2-0","iconHidden":"magritte-iconHidden___Sb3FQ_2-2-0"};
7
7
 
8
8
  const CheckboxSkeleton = ({ Component: Checkbox,
9
9
  // skeleton props
@@ -16,4 +16,4 @@ width, height, borderRadius, inline, additionalClass, loading, ...checkboxProps
16
16
  };
17
17
 
18
18
  export { CheckboxSkeleton as C, styles as s };
19
- //# sourceMappingURL=CheckboxSkeleton-933b6df6.js.map
19
+ //# sourceMappingURL=CheckboxSkeleton-4e6bc72f.js.map
package/{CheckboxSkeleton-933b6df6.js.map → CheckboxSkeleton-4e6bc72f.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxSkeleton-933b6df6.js","sources":["../src/CheckboxSkeleton.tsx"],"sourcesContent":["import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';\nimport { CheckboxProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './checkbox.less';\n\nexport const CheckboxSkeleton: IncompleteSkeletonComponent<CheckboxProps> = ({\n Component: Checkbox,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...checkboxProps\n}) => {\n const isLoading = useLoadingState() || loading;\n\n if (isLoading) {\n return (\n <div className={styles.checkboxSkeletonContainer}>\n <Skeleton loading additionalClass={styles.checkboxSkeleton} />\n </div>\n );\n }\n return <Checkbox {...checkboxProps} />;\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAMa,gBAAgB,GAA+C,CAAC,EACzE,SAAS,EAAE,QAAQ;AAEnB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,aAAa,EACnB,KAAI;AACD,IAAA,MAAM,SAAS,GAAG,eAAe,EAAE,IAAI,OAAO,CAAC;AAE/C,IAAA,IAAI,SAAS,EAAE;QACX,QACIA,aAAK,SAAS,EAAE,MAAM,CAAC,yBAAyB,YAC5CA,GAAC,CAAA,QAAQ,IAAC,OAAO,EAAA,IAAA,EAAC,eAAe,EAAE,MAAM,CAAC,gBAAgB,EAAA,CAAI,EAC5D,CAAA,EACR;AACL,KAAA;AACD,IAAA,OAAOA,GAAC,CAAA,QAAQ,EAAK,EAAA,GAAA,aAAa,GAAI,CAAC;AAC3C;;;;"}
1
+ {"version":3,"file":"CheckboxSkeleton-4e6bc72f.js","sources":["../src/CheckboxSkeleton.tsx"],"sourcesContent":["import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';\nimport { CheckboxProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './checkbox.less';\n\nexport const CheckboxSkeleton: IncompleteSkeletonComponent<CheckboxProps> = ({\n Component: Checkbox,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...checkboxProps\n}) => {\n const isLoading = useLoadingState() || loading;\n\n if (isLoading) {\n return (\n <div className={styles.checkboxSkeletonContainer}>\n <Skeleton loading additionalClass={styles.checkboxSkeleton} />\n </div>\n );\n }\n return <Checkbox {...checkboxProps} />;\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAMa,gBAAgB,GAA+C,CAAC,EACzE,SAAS,EAAE,QAAQ;AAEnB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,aAAa,EACnB,KAAI;AACD,IAAA,MAAM,SAAS,GAAG,eAAe,EAAE,IAAI,OAAO,CAAC;AAE/C,IAAA,IAAI,SAAS,EAAE;QACX,QACIA,aAAK,SAAS,EAAE,MAAM,CAAC,yBAAyB,YAC5CA,GAAC,CAAA,QAAQ,IAAC,OAAO,EAAA,IAAA,EAAC,eAAe,EAAE,MAAM,CAAC,gBAAgB,EAAA,CAAI,EAC5D,CAAA,EACR;AACL,KAAA;AACD,IAAA,OAAOA,GAAC,CAAA,QAAQ,EAAK,EAAA,GAAA,aAAa,GAAI,CAAC;AAC3C;;;;"}
package/CheckboxSkeleton.js CHANGED
@@ -2,5 +2,5 @@ import './index.css';
2
2
  import 'react/jsx-runtime';
3
3
  import '@hh.ru/magritte-common-use-loading-state';
4
4
  import '@hh.ru/magritte-ui-skeleton';
5
- export { C as CheckboxSkeleton } from './CheckboxSkeleton-933b6df6.js';
5
+ export { C as CheckboxSkeleton } from './CheckboxSkeleton-4e6bc72f.js';
6
6
  //# sourceMappingURL=CheckboxSkeleton.js.map
package/Radio.js CHANGED
@@ -2,7 +2,7 @@ import './index.css';
2
2
  import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import classnames from 'classnames';
4
4
  import { useDisabled } from '@hh.ru/magritte-common-use-disabled';
5
- import { R as RadioSkeleton, s as styles } from './RadioSkeleton-c82f74e6.js';
5
+ import { R as RadioSkeleton, s as styles } from './RadioSkeleton-94d4f852.js';
6
6
  import { RadioCircleSize24 } from '@hh.ru/magritte-ui-icon/variants/private';
7
7
  import { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';
8
8
  import '@hh.ru/magritte-common-use-loading-state';
package/{RadioSkeleton-c82f74e6.js → RadioSkeleton-94d4f852.js} RENAMED
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
3
3
  import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';
4
4
  import { Skeleton } from '@hh.ru/magritte-ui-skeleton';
5
5
 
6
- var styles = {"radio_container":"magritte-radio_container___FI0P7_2-1-4","radioContainer":"magritte-radio_container___FI0P7_2-1-4","radio_input":"magritte-radio_input___-puK7_2-1-4","radioInput":"magritte-radio_input___-puK7_2-1-4","radio":"magritte-radio___diMe7_2-1-4","icon_wrapper":"magritte-icon_wrapper___qj1JL_2-1-4","iconWrapper":"magritte-icon_wrapper___qj1JL_2-1-4","invalid":"magritte-invalid___1vONj_2-1-4","radio-skeleton-container":"magritte-radio-skeleton-container___GjZez_2-1-4","radioSkeletonContainer":"magritte-radio-skeleton-container___GjZez_2-1-4","radio-skeleton":"magritte-radio-skeleton___9TSLy_2-1-4","radioSkeleton":"magritte-radio-skeleton___9TSLy_2-1-4"};
6
+ var styles = {"radio_container":"magritte-radio_container___FI0P7_2-2-0","radioContainer":"magritte-radio_container___FI0P7_2-2-0","radio_input":"magritte-radio_input___-puK7_2-2-0","radioInput":"magritte-radio_input___-puK7_2-2-0","radio":"magritte-radio___diMe7_2-2-0","icon_wrapper":"magritte-icon_wrapper___qj1JL_2-2-0","iconWrapper":"magritte-icon_wrapper___qj1JL_2-2-0","invalid":"magritte-invalid___1vONj_2-2-0","radio-skeleton-container":"magritte-radio-skeleton-container___GjZez_2-2-0","radioSkeletonContainer":"magritte-radio-skeleton-container___GjZez_2-2-0","radio-skeleton":"magritte-radio-skeleton___9TSLy_2-2-0","radioSkeleton":"magritte-radio-skeleton___9TSLy_2-2-0"};
7
7
 
8
8
  const RadioSkeleton = ({ Component: Radio,
9
9
  // skeleton props
@@ -16,4 +16,4 @@ width, height, borderRadius, inline, additionalClass, loading, ...radioProps })
16
16
  };
17
17
 
18
18
  export { RadioSkeleton as R, styles as s };
19
- //# sourceMappingURL=RadioSkeleton-c82f74e6.js.map
19
+ //# sourceMappingURL=RadioSkeleton-94d4f852.js.map
package/{RadioSkeleton-c82f74e6.js.map → RadioSkeleton-94d4f852.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"RadioSkeleton-c82f74e6.js","sources":["../src/RadioSkeleton.tsx"],"sourcesContent":["import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';\nimport { RadioProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './radio.less';\n\nexport const RadioSkeleton: IncompleteSkeletonComponent<RadioProps> = ({\n Component: Radio,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...radioProps\n}) => {\n const isLoading = useLoadingState() || loading;\n\n if (isLoading) {\n return (\n <div className={styles.radioSkeletonContainer}>\n <Skeleton additionalClass={styles.radioSkeleton} loading={isLoading} />\n </div>\n );\n }\n\n return <Radio {...radioProps} />;\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAMa,aAAa,GAA4C,CAAC,EACnE,SAAS,EAAE,KAAK;AAEhB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,UAAU,EAChB,KAAI;AACD,IAAA,MAAM,SAAS,GAAG,eAAe,EAAE,IAAI,OAAO,CAAC;AAE/C,IAAA,IAAI,SAAS,EAAE;QACX,QACIA,aAAK,SAAS,EAAE,MAAM,CAAC,sBAAsB,EACzC,QAAA,EAAAA,GAAA,CAAC,QAAQ,EAAA,EAAC,eAAe,EAAE,MAAM,CAAC,aAAa,EAAE,OAAO,EAAE,SAAS,EAAA,CAAI,EACrE,CAAA,EACR;AACL,KAAA;AAED,IAAA,OAAOA,GAAC,CAAA,KAAK,EAAK,EAAA,GAAA,UAAU,GAAI,CAAC;AACrC;;;;"}
1
+ {"version":3,"file":"RadioSkeleton-94d4f852.js","sources":["../src/RadioSkeleton.tsx"],"sourcesContent":["import { useLoadingState } from '@hh.ru/magritte-common-use-loading-state';\nimport { RadioProps } from '@hh.ru/magritte-ui-checkbox-radio/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './radio.less';\n\nexport const RadioSkeleton: IncompleteSkeletonComponent<RadioProps> = ({\n Component: Radio,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...radioProps\n}) => {\n const isLoading = useLoadingState() || loading;\n\n if (isLoading) {\n return (\n <div className={styles.radioSkeletonContainer}>\n <Skeleton additionalClass={styles.radioSkeleton} loading={isLoading} />\n </div>\n );\n }\n\n return <Radio {...radioProps} />;\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAMa,aAAa,GAA4C,CAAC,EACnE,SAAS,EAAE,KAAK;AAEhB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,UAAU,EAChB,KAAI;AACD,IAAA,MAAM,SAAS,GAAG,eAAe,EAAE,IAAI,OAAO,CAAC;AAE/C,IAAA,IAAI,SAAS,EAAE;QACX,QACIA,aAAK,SAAS,EAAE,MAAM,CAAC,sBAAsB,EACzC,QAAA,EAAAA,GAAA,CAAC,QAAQ,EAAA,EAAC,eAAe,EAAE,MAAM,CAAC,aAAa,EAAE,OAAO,EAAE,SAAS,EAAA,CAAI,EACrE,CAAA,EACR;AACL,KAAA;AAED,IAAA,OAAOA,GAAC,CAAA,KAAK,EAAK,EAAA,GAAA,UAAU,GAAI,CAAC;AACrC;;;;"}
package/RadioSkeleton.js CHANGED
@@ -2,5 +2,5 @@ import './index.css';
2
2
  import 'react/jsx-runtime';
3
3
  import '@hh.ru/magritte-common-use-loading-state';
4
4
  import '@hh.ru/magritte-ui-skeleton';
5
- export { R as RadioSkeleton } from './RadioSkeleton-c82f74e6.js';
5
+ export { R as RadioSkeleton } from './RadioSkeleton-94d4f852.js';
6
6
  //# sourceMappingURL=RadioSkeleton.js.map
package/index.css CHANGED
@@ -45,7 +45,7 @@
45
45
  --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
46
46
  --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#919191;
47
47
  }
48
- .magritte-checkbox_container___J-wPy_2-1-4{
48
+ .magritte-checkbox_container___J-wPy_2-2-0{
49
49
  position:relative;
50
50
  display:inline-flex;
51
51
  align-items:center;
@@ -56,7 +56,7 @@
56
56
  user-select:none;
57
57
  -webkit-user-select:none;
58
58
  }
59
- .magritte-checkbox_input___tguDn_2-1-4{
59
+ .magritte-checkbox_input___tguDn_2-2-0{
60
60
  cursor:inherit;
61
61
  position:absolute;
62
62
  opacity:0;
@@ -68,10 +68,10 @@
68
68
  padding:0;
69
69
  z-index:1;
70
70
  }
71
- .magritte-checkbox_input___tguDn_2-1-4.focus-visible:not([data-focus-visible-skip]) + .magritte-checkbox___xQHy4_2-1-4{
71
+ .magritte-checkbox_input___tguDn_2-2-0.focus-visible:not([data-focus-visible-skip]) + .magritte-checkbox___xQHy4_2-2-0{
72
72
  outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1);
73
73
  }
74
- .magritte-checkbox___xQHy4_2-1-4{
74
+ .magritte-checkbox___xQHy4_2-2-0{
75
75
  width:20px;
76
76
  height:20px;
77
77
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
@@ -85,9 +85,11 @@
85
85
  transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
86
86
  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
87
87
  }
88
- .magritte-icon_wrapper___k96d9_2-1-4{
88
+ .magritte-icon_wrapper___k96d9_2-2-0{
89
89
  position:absolute;
90
90
  display:flex;
91
+ width:24px;
92
+ height:24px;
91
93
  justify-content:center;
92
94
  align-content:center;
93
95
  transition-property:opacity;
@@ -96,121 +98,148 @@
96
98
  opacity:0;
97
99
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
98
100
  }
99
- .magritte-checkbox_input___tguDn_2-1-4:checked + .magritte-checkbox___xQHy4_2-1-4{
101
+ .magritte-checkbox_input___tguDn_2-2-0:checked + .magritte-checkbox___xQHy4_2-2-0{
100
102
  background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
101
103
  border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
102
104
  }
103
- .magritte-checkbox_input___tguDn_2-1-4:checked ~ .magritte-icon_wrapper___k96d9_2-1-4{
105
+ .magritte-checkbox_input___tguDn_2-2-0:checked ~ .magritte-icon_wrapper___k96d9_2-2-0{
104
106
  opacity:1;
105
107
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
106
108
  }
107
- .magritte-checkbox_input___tguDn_2-1-4 + .magritte-invalid___6k7qT_2-1-4{
109
+ .magritte-checkbox_input___tguDn_2-2-0 + .magritte-invalid___6k7qT_2-2-0{
108
110
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
109
111
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
110
112
  }
111
- .magritte-checkbox_input___tguDn_2-1-4.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___6k7qT_2-1-4{
113
+ .magritte-checkbox_input___tguDn_2-2-0.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___6k7qT_2-2-0{
112
114
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
113
115
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
114
116
  outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1);
115
117
  }
116
- .magritte-checkbox_input___tguDn_2-1-4:disabled:checked + .magritte-checkbox___xQHy4_2-1-4{
118
+ .magritte-checkbox_input___tguDn_2-2-0:disabled:checked + .magritte-checkbox___xQHy4_2-2-0{
117
119
  background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
118
120
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
119
121
  }
120
- .magritte-checkbox_input___tguDn_2-1-4:disabled:checked ~ .magritte-icon_wrapper___k96d9_2-1-4{
122
+ .magritte-checkbox_input___tguDn_2-2-0:disabled:checked ~ .magritte-icon_wrapper___k96d9_2-2-0{
121
123
  opacity:1;
122
124
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
123
125
  }
124
- .magritte-checkbox_input___tguDn_2-1-4:disabled{
126
+ .magritte-checkbox_input___tguDn_2-2-0:disabled{
125
127
  cursor:not-allowed;
126
128
  }
127
- .magritte-checkbox_input___tguDn_2-1-4:disabled + .magritte-checkbox___xQHy4_2-1-4{
129
+ .magritte-checkbox_input___tguDn_2-2-0:disabled + .magritte-checkbox___xQHy4_2-2-0{
128
130
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1);
129
131
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1);
130
132
  }
131
- .magritte-checkbox_input___tguDn_2-1-4:disabled ~ .magritte-icon_wrapper___k96d9_2-1-4{
133
+ .magritte-checkbox_input___tguDn_2-2-0:disabled ~ .magritte-icon_wrapper___k96d9_2-2-0{
132
134
  opacity:0;
133
135
  }
134
136
  @media (min-width: 1020px){
135
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-4:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-4{
137
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
136
138
  background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
137
139
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
138
140
  }
139
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-4:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-4{
141
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
140
142
  opacity:1;
141
143
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
142
144
  }
143
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-4{
145
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
146
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
147
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
148
+ }
149
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
150
+ opacity:1;
151
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
152
+ }
153
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
144
154
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
145
155
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
146
156
  }
147
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) + .magritte-invalid___6k7qT_2-1-4{
157
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) + .magritte-invalid___6k7qT_2-2-0{
148
158
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
149
159
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
150
160
  }
151
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-4{
161
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
152
162
  opacity:1;
153
163
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
154
164
  }
155
165
  }
156
166
  @media (min-width: 1024px){
157
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-4:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-4{
167
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
168
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
169
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
170
+ }
171
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
172
+ opacity:1;
173
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
174
+ }
175
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
158
176
  background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
159
177
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
160
178
  }
161
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-4:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-4{
179
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
162
180
  opacity:1;
163
181
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
164
182
  }
165
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-4{
183
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-0{
166
184
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
167
185
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
168
186
  }
169
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) + .magritte-invalid___6k7qT_2-1-4{
187
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) + .magritte-invalid___6k7qT_2-2-0{
170
188
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
171
189
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
172
190
  }
173
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-4:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-4{
191
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-0:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-0{
174
192
  opacity:1;
175
193
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
176
194
  }
177
195
  }
178
- .magritte-checkbox_input___tguDn_2-1-4:indeterminate + .magritte-checkbox___xQHy4_2-1-4{
196
+ .magritte-checkbox_input___tguDn_2-2-0:indeterminate + .magritte-checkbox___xQHy4_2-2-0{
179
197
  background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
180
198
  border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
181
199
  }
182
- .magritte-checkbox_input___tguDn_2-1-4:indeterminate ~ .magritte-icon_wrapper___k96d9_2-1-4{
200
+ .magritte-checkbox_input___tguDn_2-2-0:indeterminate ~ .magritte-icon_wrapper___k96d9_2-2-0{
183
201
  opacity:1;
184
202
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
185
203
  }
186
- .magritte-checkbox_input___tguDn_2-1-4:indeterminate:hover + .magritte-checkbox___xQHy4_2-1-4{
204
+ .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover + .magritte-checkbox___xQHy4_2-2-0{
187
205
  background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
188
206
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
189
207
  }
190
- .magritte-checkbox_input___tguDn_2-1-4:indeterminate:hover ~ .magritte-icon_wrapper___k96d9_2-1-4{
208
+ .magritte-checkbox_input___tguDn_2-2-0:indeterminate:hover ~ .magritte-icon_wrapper___k96d9_2-2-0{
191
209
  opacity:1;
192
210
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
193
211
  }
194
- .magritte-checkbox_input___tguDn_2-1-4:disabled:indeterminate + .magritte-checkbox___xQHy4_2-1-4{
212
+ .magritte-checkbox_input___tguDn_2-2-0:disabled:indeterminate + .magritte-checkbox___xQHy4_2-2-0{
195
213
  background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
196
214
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
197
215
  }
198
- .magritte-checkbox_input___tguDn_2-1-4:disabled:indeterminate ~ .magritte-icon_wrapper___k96d9_2-1-4{
216
+ .magritte-checkbox_input___tguDn_2-2-0:disabled:indeterminate ~ .magritte-icon_wrapper___k96d9_2-2-0{
199
217
  opacity:1;
200
218
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
201
219
  }
202
- .magritte-checkbox-skeleton-container___4uNYP_2-1-4{
220
+ .magritte-checkbox-skeleton-container___4uNYP_2-2-0{
203
221
  display:inline-flex;
204
222
  align-items:center;
205
223
  justify-content:center;
206
224
  width:24px;
207
225
  height:24px;
208
226
  }
209
- .magritte-checkbox-skeleton___uo6u7_2-1-4{
227
+ .magritte-checkbox-skeleton___uo6u7_2-2-0{
210
228
  width:20px;
211
229
  height:20px;
212
230
  border-radius:var(--magritte-core-border-radius-1-x-v18-1-1);
213
231
  }
232
+ .magritte-icon___q1TLo_2-2-0{
233
+ opacity:1;
234
+ position:absolute;
235
+ line-height:0;
236
+ transition-property:opacity;
237
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
238
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
239
+ }
240
+ .magritte-icon___q1TLo_2-2-0.magritte-iconHidden___Sb3FQ_2-2-0{
241
+ opacity:0;
242
+ }
214
243
 
215
244
  :root{
216
245
  --magritte-color-component-checkable-background-unchecked-v18-1-1:#ffffff;
@@ -259,7 +288,7 @@
259
288
  --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
260
289
  --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#919191;
261
290
  }
262
- .magritte-radio_container___FI0P7_2-1-4{
291
+ .magritte-radio_container___FI0P7_2-2-0{
263
292
  position:relative;
264
293
  display:inline-flex;
265
294
  align-items:center;
@@ -270,7 +299,7 @@
270
299
  user-select:none;
271
300
  -webkit-user-select:none;
272
301
  }
273
- .magritte-radio_input___-puK7_2-1-4{
302
+ .magritte-radio_input___-puK7_2-2-0{
274
303
  cursor:inherit;
275
304
  position:absolute;
276
305
  opacity:0;
@@ -282,10 +311,10 @@
282
311
  padding:0;
283
312
  z-index:1;
284
313
  }
285
- .magritte-radio_input___-puK7_2-1-4.focus-visible:not([data-focus-visible-skip]) + .magritte-radio___diMe7_2-1-4{
314
+ .magritte-radio_input___-puK7_2-2-0.focus-visible:not([data-focus-visible-skip]) + .magritte-radio___diMe7_2-2-0{
286
315
  outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1);
287
316
  }
288
- .magritte-radio___diMe7_2-1-4{
317
+ .magritte-radio___diMe7_2-2-0{
289
318
  width:20px;
290
319
  height:20px;
291
320
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
@@ -299,9 +328,11 @@
299
328
  transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
300
329
  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
301
330
  }
302
- .magritte-icon_wrapper___qj1JL_2-1-4{
331
+ .magritte-icon_wrapper___qj1JL_2-2-0{
303
332
  position:absolute;
304
333
  display:flex;
334
+ width:24px;
335
+ height:24px;
305
336
  justify-content:center;
306
337
  align-content:center;
307
338
  transition-property:opacity;
@@ -310,96 +341,112 @@
310
341
  opacity:0;
311
342
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
312
343
  }
313
- .magritte-radio_input___-puK7_2-1-4:checked + .magritte-radio___diMe7_2-1-4{
344
+ .magritte-radio_input___-puK7_2-2-0:checked + .magritte-radio___diMe7_2-2-0{
314
345
  background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
315
346
  border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
316
347
  }
317
- .magritte-radio_input___-puK7_2-1-4:checked ~ .magritte-icon_wrapper___qj1JL_2-1-4{
348
+ .magritte-radio_input___-puK7_2-2-0:checked ~ .magritte-icon_wrapper___qj1JL_2-2-0{
318
349
  opacity:1;
319
350
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
320
351
  }
321
- .magritte-radio_input___-puK7_2-1-4 + .magritte-invalid___1vONj_2-1-4{
352
+ .magritte-radio_input___-puK7_2-2-0 + .magritte-invalid___1vONj_2-2-0{
322
353
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
323
354
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
324
355
  }
325
- .magritte-radio_input___-puK7_2-1-4.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___1vONj_2-1-4{
356
+ .magritte-radio_input___-puK7_2-2-0.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___1vONj_2-2-0{
326
357
  background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
327
358
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
328
359
  outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1);
329
360
  }
330
- .magritte-radio_input___-puK7_2-1-4:disabled:checked + .magritte-radio___diMe7_2-1-4{
361
+ .magritte-radio_input___-puK7_2-2-0:disabled:checked + .magritte-radio___diMe7_2-2-0{
331
362
  background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
332
363
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
333
364
  }
334
- .magritte-radio_input___-puK7_2-1-4:disabled:checked ~ .magritte-icon_wrapper___qj1JL_2-1-4{
365
+ .magritte-radio_input___-puK7_2-2-0:disabled:checked ~ .magritte-icon_wrapper___qj1JL_2-2-0{
335
366
  opacity:1;
336
367
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
337
368
  }
338
- .magritte-radio_input___-puK7_2-1-4:disabled{
369
+ .magritte-radio_input___-puK7_2-2-0:disabled{
339
370
  cursor:not-allowed;
340
371
  }
341
- .magritte-radio_input___-puK7_2-1-4:disabled + .magritte-radio___diMe7_2-1-4{
372
+ .magritte-radio_input___-puK7_2-2-0:disabled + .magritte-radio___diMe7_2-2-0{
342
373
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1);
343
374
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1);
344
375
  }
345
- .magritte-radio_input___-puK7_2-1-4:disabled ~ .magritte-icon_wrapper___qj1JL_2-1-4{
376
+ .magritte-radio_input___-puK7_2-2-0:disabled ~ .magritte-icon_wrapper___qj1JL_2-2-0{
346
377
  opacity:0;
347
378
  }
348
379
  @media (min-width: 1020px){
349
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-4:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-1-4{
380
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
381
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
382
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
383
+ }
384
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
385
+ opacity:1;
386
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
387
+ }
388
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:indeterminate:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
350
389
  background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
351
390
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
352
391
  }
353
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-4:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-4{
392
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
354
393
  opacity:1;
355
394
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
356
395
  }
357
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) + .magritte-radio___diMe7_2-1-4{
396
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
358
397
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
359
398
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
360
399
  }
361
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) + .magritte-invalid___1vONj_2-1-4{
400
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) + .magritte-invalid___1vONj_2-2-0{
362
401
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
363
402
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
364
403
  }
365
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-4{
404
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
366
405
  opacity:1;
367
406
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
368
407
  }
369
408
  }
370
409
  @media (min-width: 1024px){
371
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-4:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-1-4{
410
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
411
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
412
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
413
+ }
414
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
415
+ opacity:1;
416
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
417
+ }
418
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:indeterminate:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
372
419
  background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
373
420
  border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
374
421
  }
375
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-4:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-4{
422
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
376
423
  opacity:1;
377
424
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
378
425
  }
379
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) + .magritte-radio___diMe7_2-1-4{
426
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) + .magritte-radio___diMe7_2-2-0{
380
427
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
381
428
  border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
382
429
  }
383
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) + .magritte-invalid___1vONj_2-1-4{
430
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) + .magritte-invalid___1vONj_2-2-0{
384
431
  background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
385
432
  border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
386
433
  }
387
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-4:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-4{
434
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-0:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-0{
388
435
  opacity:1;
389
436
  --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
390
437
  }
391
438
  }
392
- .magritte-radio___diMe7_2-1-4{
439
+ .magritte-radio___diMe7_2-2-0{
393
440
  border-radius:50%;
394
441
  }
395
- .magritte-radio-skeleton-container___GjZez_2-1-4{
442
+ .magritte-radio-skeleton-container___GjZez_2-2-0{
396
443
  display:inline-flex;
397
444
  align-items:center;
398
445
  justify-content:center;
399
446
  width:24px;
400
447
  height:24px;
401
448
  }
402
- .magritte-radio-skeleton___9TSLy_2-1-4{
449
+ .magritte-radio-skeleton___9TSLy_2-2-0{
403
450
  width:20px;
404
451
  height:20px;
405
452
  border-radius:50%;
package/index.js CHANGED
@@ -7,9 +7,9 @@ import 'react/jsx-runtime';
7
7
  import 'react';
8
8
  import 'classnames';
9
9
  import '@hh.ru/magritte-common-use-disabled';
10
- import './CheckboxSkeleton-933b6df6.js';
10
+ import './CheckboxSkeleton-4e6bc72f.js';
11
11
  import '@hh.ru/magritte-common-use-loading-state';
12
12
  import '@hh.ru/magritte-ui-skeleton';
13
13
  import '@hh.ru/magritte-ui-icon/variants/private';
14
- import './RadioSkeleton-c82f74e6.js';
14
+ import './RadioSkeleton-94d4f852.js';
15
15
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-checkbox-radio",
3
- "version": "2.1.4",
3
+ "version": "2.2.0",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -24,7 +24,7 @@
24
24
  "@hh.ru/magritte-design-tokens": "18.1.1",
25
25
  "@hh.ru/magritte-types": "4.0.1",
26
26
  "@hh.ru/magritte-ui-breakpoint": "4.0.1",
27
- "@hh.ru/magritte-ui-icon": "7.1.3",
27
+ "@hh.ru/magritte-ui-icon": "7.1.4",
28
28
  "@hh.ru/magritte-ui-skeleton": "2.1.2",
29
29
  "@hh.ru/magritte-ui-theme-provider": "1.1.21"
30
30
  },
@@ -35,5 +35,5 @@
35
35
  "publishConfig": {
36
36
  "access": "public"
37
37
  },
38
- "gitHead": "b660dd64fca3eaad5ec44ea9a73f92bb0d9694aa"
38
+ "gitHead": "fb0ed62dbc8f4a497a5e18d3a2c887be8122a950"
39
39
  }