@hh.ru/magritte-ui-checkbox-radio 2.1.5 → 2.2.1

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-3ffbf900.js → CheckboxSkeleton-7b05ddc6.js} +2 -2
  4. package/{CheckboxSkeleton-3ffbf900.js.map → CheckboxSkeleton-7b05ddc6.js.map} +1 -1
  5. package/CheckboxSkeleton.js +1 -1
  6. package/Radio.js +1 -1
  7. package/{RadioSkeleton-a756c251.js → RadioSkeleton-dc4ff11e.js} +2 -2
  8. package/{RadioSkeleton-a756c251.js.map → RadioSkeleton-dc4ff11e.js.map} +1 -1
  9. package/RadioSkeleton.js +1 -1
  10. package/index.css +276 -229
  11. package/index.js +2 -2
  12. package/package.json +6 -6
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-3ffbf900.js';
6
+ import { C as CheckboxSkeleton, s as styles } from './CheckboxSkeleton-7b05ddc6.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-3ffbf900.js → CheckboxSkeleton-7b05ddc6.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-5","checkboxContainer":"magritte-checkbox_container___J-wPy_2-1-5","checkbox_input":"magritte-checkbox_input___tguDn_2-1-5","checkboxInput":"magritte-checkbox_input___tguDn_2-1-5","checkbox":"magritte-checkbox___xQHy4_2-1-5","icon_wrapper":"magritte-icon_wrapper___k96d9_2-1-5","iconWrapper":"magritte-icon_wrapper___k96d9_2-1-5","invalid":"magritte-invalid___6k7qT_2-1-5","checkbox-skeleton-container":"magritte-checkbox-skeleton-container___4uNYP_2-1-5","checkboxSkeletonContainer":"magritte-checkbox-skeleton-container___4uNYP_2-1-5","checkbox-skeleton":"magritte-checkbox-skeleton___uo6u7_2-1-5","checkboxSkeleton":"magritte-checkbox-skeleton___uo6u7_2-1-5"};
6
+ var styles = {"checkbox_container":"magritte-checkbox_container___J-wPy_2-2-1","checkboxContainer":"magritte-checkbox_container___J-wPy_2-2-1","checkbox_input":"magritte-checkbox_input___tguDn_2-2-1","checkboxInput":"magritte-checkbox_input___tguDn_2-2-1","checkbox":"magritte-checkbox___xQHy4_2-2-1","icon_wrapper":"magritte-icon_wrapper___k96d9_2-2-1","iconWrapper":"magritte-icon_wrapper___k96d9_2-2-1","invalid":"magritte-invalid___6k7qT_2-2-1","checkbox-skeleton-container":"magritte-checkbox-skeleton-container___4uNYP_2-2-1","checkboxSkeletonContainer":"magritte-checkbox-skeleton-container___4uNYP_2-2-1","checkbox-skeleton":"magritte-checkbox-skeleton___uo6u7_2-2-1","checkboxSkeleton":"magritte-checkbox-skeleton___uo6u7_2-2-1","icon":"magritte-icon___q1TLo_2-2-1","iconHidden":"magritte-iconHidden___Sb3FQ_2-2-1"};
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-3ffbf900.js.map
19
+ //# sourceMappingURL=CheckboxSkeleton-7b05ddc6.js.map
package/{CheckboxSkeleton-3ffbf900.js.map → CheckboxSkeleton-7b05ddc6.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxSkeleton-3ffbf900.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-7b05ddc6.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-3ffbf900.js';
5
+ export { C as CheckboxSkeleton } from './CheckboxSkeleton-7b05ddc6.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-a756c251.js';
5
+ import { R as RadioSkeleton, s as styles } from './RadioSkeleton-dc4ff11e.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-a756c251.js → RadioSkeleton-dc4ff11e.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-5","radioContainer":"magritte-radio_container___FI0P7_2-1-5","radio_input":"magritte-radio_input___-puK7_2-1-5","radioInput":"magritte-radio_input___-puK7_2-1-5","radio":"magritte-radio___diMe7_2-1-5","icon_wrapper":"magritte-icon_wrapper___qj1JL_2-1-5","iconWrapper":"magritte-icon_wrapper___qj1JL_2-1-5","invalid":"magritte-invalid___1vONj_2-1-5","radio-skeleton-container":"magritte-radio-skeleton-container___GjZez_2-1-5","radioSkeletonContainer":"magritte-radio-skeleton-container___GjZez_2-1-5","radio-skeleton":"magritte-radio-skeleton___9TSLy_2-1-5","radioSkeleton":"magritte-radio-skeleton___9TSLy_2-1-5"};
6
+ var styles = {"radio_container":"magritte-radio_container___FI0P7_2-2-1","radioContainer":"magritte-radio_container___FI0P7_2-2-1","radio_input":"magritte-radio_input___-puK7_2-2-1","radioInput":"magritte-radio_input___-puK7_2-2-1","radio":"magritte-radio___diMe7_2-2-1","icon_wrapper":"magritte-icon_wrapper___qj1JL_2-2-1","iconWrapper":"magritte-icon_wrapper___qj1JL_2-2-1","invalid":"magritte-invalid___1vONj_2-2-1","radio-skeleton-container":"magritte-radio-skeleton-container___GjZez_2-2-1","radioSkeletonContainer":"magritte-radio-skeleton-container___GjZez_2-2-1","radio-skeleton":"magritte-radio-skeleton___9TSLy_2-2-1","radioSkeleton":"magritte-radio-skeleton___9TSLy_2-2-1"};
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-a756c251.js.map
19
+ //# sourceMappingURL=RadioSkeleton-dc4ff11e.js.map
package/{RadioSkeleton-a756c251.js.map → RadioSkeleton-dc4ff11e.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"RadioSkeleton-a756c251.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-dc4ff11e.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-a756c251.js';
5
+ export { R as RadioSkeleton } from './RadioSkeleton-dc4ff11e.js';
6
6
  //# sourceMappingURL=RadioSkeleton.js.map
package/index.css CHANGED
@@ -1,51 +1,51 @@
1
1
  :root{
2
- --magritte-color-component-checkable-background-unchecked-v18-1-1:#ffffff;
3
- --magritte-color-component-checkable-background-checked-v18-1-1:#0070ff;
4
- --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1:#ffffff;
5
- --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1:#ffffff;
6
- --magritte-color-component-checkable-background-state-checked-hovered-v18-1-1:#2b7fff;
7
- --magritte-color-component-checkable-background-state-checked-disabled-v18-1-1:#CCD5DF;
8
- --magritte-color-component-checkable-stroke-unchecked-v18-1-1:#DCE3EB;
9
- --magritte-color-component-checkable-stroke-checked-v18-1-1:#0070ff;
10
- --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1:#CCD5DF;
11
- --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1:#2b7fff;
12
- --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1:#DCE3EB;
13
- --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1:#CCD5DF;
14
- --magritte-color-component-checkable-stroke-state-invalid-v18-1-1:#ff4d3a;
15
- --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1:#ff4d3a7a;
16
- --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1:#0070ff7a;
17
- --magritte-color-component-checkable-icon-checked-v18-1-1:#ffffff;
18
- --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1:#EEF1F7;
19
- --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
20
- --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#ffffff;
2
+ --magritte-color-component-checkable-background-unchecked-v18-1-2:#ffffff;
3
+ --magritte-color-component-checkable-background-checked-v18-1-2:#0070ff;
4
+ --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2:#ffffff;
5
+ --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2:#ffffff;
6
+ --magritte-color-component-checkable-background-state-checked-hovered-v18-1-2:#2b7fff;
7
+ --magritte-color-component-checkable-background-state-checked-disabled-v18-1-2:#CCD5DF;
8
+ --magritte-color-component-checkable-stroke-unchecked-v18-1-2:#DCE3EB;
9
+ --magritte-color-component-checkable-stroke-checked-v18-1-2:#0070ff;
10
+ --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2:#CCD5DF;
11
+ --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2:#2b7fff;
12
+ --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2:#EEF1F7;
13
+ --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2:#CCD5DF;
14
+ --magritte-color-component-checkable-stroke-state-invalid-v18-1-2:#ff4d3a;
15
+ --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2:#ff4d3a7a;
16
+ --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2:#0070ff7a;
17
+ --magritte-color-component-checkable-icon-checked-v18-1-2:#ffffff;
18
+ --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2:#EEF1F7;
19
+ --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2:#ffffff;
20
+ --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2:#ffffff;
21
21
  }
22
22
  :root{
23
- --magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1:cubic-bezier(0.25, 0.1, 0.25, 1);
24
- --magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1:200ms;
25
- --magritte-core-border-radius-1-x-v18-1-1:4px;
23
+ --magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2:cubic-bezier(0.25, 0.1, 0.25, 1);
24
+ --magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2:200ms;
25
+ --magritte-core-border-radius-1-x-v18-1-2:4px;
26
26
  }
27
27
  .magritte-night-theme{
28
- --magritte-color-component-checkable-background-unchecked-v18-1-1:#1B1B1B;
29
- --magritte-color-component-checkable-background-checked-v18-1-1:#2b7fff;
30
- --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1:#262626;
31
- --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1:#1B1B1B;
32
- --magritte-color-component-checkable-background-state-checked-hovered-v18-1-1:#468ffd;
33
- --magritte-color-component-checkable-background-state-checked-disabled-v18-1-1:#303030;
34
- --magritte-color-component-checkable-stroke-unchecked-v18-1-1:#303030;
35
- --magritte-color-component-checkable-stroke-checked-v18-1-1:#2b7fff;
36
- --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1:#3B3B3B;
37
- --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1:#468ffd;
38
- --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1:#303030;
39
- --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1:#303030;
40
- --magritte-color-component-checkable-stroke-state-invalid-v18-1-1:#ff4d3a;
41
- --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1:#ff4d3a7a;
42
- --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1:#0070ff7a;
43
- --magritte-color-component-checkable-icon-checked-v18-1-1:#ffffff;
44
- --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1:#303030;
45
- --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
46
- --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#919191;
47
- }
48
- .magritte-checkbox_container___J-wPy_2-1-5{
28
+ --magritte-color-component-checkable-background-unchecked-v18-1-2:#1B1B1B;
29
+ --magritte-color-component-checkable-background-checked-v18-1-2:#2b7fff;
30
+ --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2:#262626;
31
+ --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2:#1B1B1B;
32
+ --magritte-color-component-checkable-background-state-checked-hovered-v18-1-2:#468ffd;
33
+ --magritte-color-component-checkable-background-state-checked-disabled-v18-1-2:#303030;
34
+ --magritte-color-component-checkable-stroke-unchecked-v18-1-2:#303030;
35
+ --magritte-color-component-checkable-stroke-checked-v18-1-2:#2b7fff;
36
+ --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2:#3B3B3B;
37
+ --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2:#468ffd;
38
+ --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2:#303030;
39
+ --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2:#303030;
40
+ --magritte-color-component-checkable-stroke-state-invalid-v18-1-2:#ff4d3a;
41
+ --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2:#ff4d3a7a;
42
+ --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2:#0070ff7a;
43
+ --magritte-color-component-checkable-icon-checked-v18-1-2:#ffffff;
44
+ --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2:#303030;
45
+ --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2:#ffffff;
46
+ --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2:#919191;
47
+ }
48
+ .magritte-checkbox_container___J-wPy_2-2-1{
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-5{
59
+ .magritte-checkbox_input___tguDn_2-2-1{
60
60
  cursor:inherit;
61
61
  position:absolute;
62
62
  opacity:0;
@@ -68,198 +68,227 @@
68
68
  padding:0;
69
69
  z-index:1;
70
70
  }
71
- .magritte-checkbox_input___tguDn_2-1-5.focus-visible:not([data-focus-visible-skip]) + .magritte-checkbox___xQHy4_2-1-5{
72
- outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1);
71
+ .magritte-checkbox_input___tguDn_2-2-1.focus-visible:not([data-focus-visible-skip]) + .magritte-checkbox___xQHy4_2-2-1{
72
+ outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2);
73
73
  }
74
- .magritte-checkbox___xQHy4_2-1-5{
74
+ .magritte-checkbox___xQHy4_2-2-1{
75
75
  width:20px;
76
76
  height:20px;
77
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
78
- border:1.5px solid var(--magritte-color-component-checkable-stroke-unchecked-v18-1-1);
77
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
78
+ border:1.5px solid var(--magritte-color-component-checkable-stroke-unchecked-v18-1-2);
79
79
  box-sizing:border-box;
80
- border-radius:var(--magritte-core-border-radius-1-x-v18-1-1);
80
+ border-radius:var(--magritte-core-border-radius-1-x-v18-1-2);
81
81
  display:flex;
82
82
  align-items:center;
83
83
  justify-content:center;
84
84
  transition-property:background-color, border-color;
85
- transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
86
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
85
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2);
86
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2);
87
87
  }
88
- .magritte-icon_wrapper___k96d9_2-1-5{
88
+ .magritte-icon_wrapper___k96d9_2-2-1{
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;
94
- transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
95
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
96
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2);
97
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2);
96
98
  opacity:0;
97
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
99
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
98
100
  }
99
- .magritte-checkbox_input___tguDn_2-1-5:checked + .magritte-checkbox___xQHy4_2-1-5{
100
- background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
101
- border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
101
+ .magritte-checkbox_input___tguDn_2-2-1:checked + .magritte-checkbox___xQHy4_2-2-1{
102
+ background-color:var(--magritte-color-component-checkable-background-checked-v18-1-2);
103
+ border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-2);
102
104
  }
103
- .magritte-checkbox_input___tguDn_2-1-5:checked ~ .magritte-icon_wrapper___k96d9_2-1-5{
105
+ .magritte-checkbox_input___tguDn_2-2-1:checked ~ .magritte-icon_wrapper___k96d9_2-2-1{
104
106
  opacity:1;
105
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
107
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-2);
106
108
  }
107
- .magritte-checkbox_input___tguDn_2-1-5 + .magritte-invalid___6k7qT_2-1-5{
108
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
109
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
109
+ .magritte-checkbox_input___tguDn_2-2-1 + .magritte-invalid___6k7qT_2-2-1{
110
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
111
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
110
112
  }
111
- .magritte-checkbox_input___tguDn_2-1-5.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___6k7qT_2-1-5{
112
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
113
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
114
- outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1);
113
+ .magritte-checkbox_input___tguDn_2-2-1.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___6k7qT_2-2-1{
114
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
115
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
116
+ outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2);
115
117
  }
116
- .magritte-checkbox_input___tguDn_2-1-5:disabled:checked + .magritte-checkbox___xQHy4_2-1-5{
117
- background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
118
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
118
+ .magritte-checkbox_input___tguDn_2-2-1:disabled:checked + .magritte-checkbox___xQHy4_2-2-1{
119
+ background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-2);
120
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2);
119
121
  }
120
- .magritte-checkbox_input___tguDn_2-1-5:disabled:checked ~ .magritte-icon_wrapper___k96d9_2-1-5{
122
+ .magritte-checkbox_input___tguDn_2-2-1:disabled:checked ~ .magritte-icon_wrapper___k96d9_2-2-1{
121
123
  opacity:1;
122
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
124
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2);
123
125
  }
124
- .magritte-checkbox_input___tguDn_2-1-5:disabled{
126
+ .magritte-checkbox_input___tguDn_2-2-1:disabled{
125
127
  cursor:not-allowed;
126
128
  }
127
- .magritte-checkbox_input___tguDn_2-1-5:disabled + .magritte-checkbox___xQHy4_2-1-5{
128
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1);
129
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1);
129
+ .magritte-checkbox_input___tguDn_2-2-1:disabled + .magritte-checkbox___xQHy4_2-2-1{
130
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2);
131
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2);
130
132
  }
131
- .magritte-checkbox_input___tguDn_2-1-5:disabled ~ .magritte-icon_wrapper___k96d9_2-1-5{
133
+ .magritte-checkbox_input___tguDn_2-2-1:disabled ~ .magritte-icon_wrapper___k96d9_2-2-1{
132
134
  opacity:0;
133
135
  }
134
136
  @media (min-width: 1020px){
135
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-5:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-5{
136
- background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
137
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
137
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
138
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
139
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
140
+ }
141
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
142
+ opacity:1;
143
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
144
+ }
145
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
146
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
147
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
138
148
  }
139
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-5:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-5{
149
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
140
150
  opacity:1;
141
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
151
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
142
152
  }
143
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-5{
144
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
145
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
153
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
154
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
155
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2);
146
156
  }
147
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) + .magritte-invalid___6k7qT_2-1-5{
148
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
149
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
157
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) + .magritte-invalid___6k7qT_2-2-1{
158
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
159
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
150
160
  }
151
- body.magritte-old-layout .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-5{
161
+ body.magritte-old-layout .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
152
162
  opacity:1;
153
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
163
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
154
164
  }
155
165
  }
156
166
  @media (min-width: 1024px){
157
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-5:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-5{
158
- background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
159
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
167
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:checked:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
168
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
169
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
160
170
  }
161
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-5:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-5{
171
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
162
172
  opacity:1;
163
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
173
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
164
174
  }
165
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-1-5{
166
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
167
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
175
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
176
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
177
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
168
178
  }
169
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) + .magritte-invalid___6k7qT_2-1-5{
170
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
171
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
179
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
180
+ opacity:1;
181
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
172
182
  }
173
- body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-1-5:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-1-5{
183
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) + .magritte-checkbox___xQHy4_2-2-1{
184
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
185
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2);
186
+ }
187
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) + .magritte-invalid___6k7qT_2-2-1{
188
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
189
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
190
+ }
191
+ body:not(.magritte-old-layout) .magritte-checkbox_input___tguDn_2-2-1:hover:not(:disabled) ~ .magritte-icon_wrapper___k96d9_2-2-1{
174
192
  opacity:1;
175
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
193
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
176
194
  }
177
195
  }
178
- .magritte-checkbox_input___tguDn_2-1-5:indeterminate + .magritte-checkbox___xQHy4_2-1-5{
179
- background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
180
- border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
196
+ .magritte-checkbox_input___tguDn_2-2-1:indeterminate + .magritte-checkbox___xQHy4_2-2-1{
197
+ background-color:var(--magritte-color-component-checkable-background-checked-v18-1-2);
198
+ border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-2);
181
199
  }
182
- .magritte-checkbox_input___tguDn_2-1-5:indeterminate ~ .magritte-icon_wrapper___k96d9_2-1-5{
200
+ .magritte-checkbox_input___tguDn_2-2-1:indeterminate ~ .magritte-icon_wrapper___k96d9_2-2-1{
183
201
  opacity:1;
184
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
202
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-2);
185
203
  }
186
- .magritte-checkbox_input___tguDn_2-1-5:indeterminate:hover + .magritte-checkbox___xQHy4_2-1-5{
187
- background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
188
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
204
+ .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover + .magritte-checkbox___xQHy4_2-2-1{
205
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
206
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
189
207
  }
190
- .magritte-checkbox_input___tguDn_2-1-5:indeterminate:hover ~ .magritte-icon_wrapper___k96d9_2-1-5{
208
+ .magritte-checkbox_input___tguDn_2-2-1:indeterminate:hover ~ .magritte-icon_wrapper___k96d9_2-2-1{
191
209
  opacity:1;
192
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
210
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
193
211
  }
194
- .magritte-checkbox_input___tguDn_2-1-5:disabled:indeterminate + .magritte-checkbox___xQHy4_2-1-5{
195
- background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
196
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
212
+ .magritte-checkbox_input___tguDn_2-2-1:disabled:indeterminate + .magritte-checkbox___xQHy4_2-2-1{
213
+ background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-2);
214
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2);
197
215
  }
198
- .magritte-checkbox_input___tguDn_2-1-5:disabled:indeterminate ~ .magritte-icon_wrapper___k96d9_2-1-5{
216
+ .magritte-checkbox_input___tguDn_2-2-1:disabled:indeterminate ~ .magritte-icon_wrapper___k96d9_2-2-1{
199
217
  opacity:1;
200
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
218
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2);
201
219
  }
202
- .magritte-checkbox-skeleton-container___4uNYP_2-1-5{
220
+ .magritte-checkbox-skeleton-container___4uNYP_2-2-1{
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-5{
227
+ .magritte-checkbox-skeleton___uo6u7_2-2-1{
210
228
  width:20px;
211
229
  height:20px;
212
- border-radius:var(--magritte-core-border-radius-1-x-v18-1-1);
230
+ border-radius:var(--magritte-core-border-radius-1-x-v18-1-2);
231
+ }
232
+ .magritte-icon___q1TLo_2-2-1{
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-2);
238
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2);
239
+ }
240
+ .magritte-icon___q1TLo_2-2-1.magritte-iconHidden___Sb3FQ_2-2-1{
241
+ opacity:0;
213
242
  }
214
243
 
215
244
  :root{
216
- --magritte-color-component-checkable-background-unchecked-v18-1-1:#ffffff;
217
- --magritte-color-component-checkable-background-checked-v18-1-1:#0070ff;
218
- --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1:#ffffff;
219
- --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1:#ffffff;
220
- --magritte-color-component-checkable-background-state-checked-hovered-v18-1-1:#2b7fff;
221
- --magritte-color-component-checkable-background-state-checked-disabled-v18-1-1:#CCD5DF;
222
- --magritte-color-component-checkable-stroke-unchecked-v18-1-1:#DCE3EB;
223
- --magritte-color-component-checkable-stroke-checked-v18-1-1:#0070ff;
224
- --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1:#CCD5DF;
225
- --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1:#2b7fff;
226
- --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1:#DCE3EB;
227
- --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1:#CCD5DF;
228
- --magritte-color-component-checkable-stroke-state-invalid-v18-1-1:#ff4d3a;
229
- --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1:#ff4d3a7a;
230
- --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1:#0070ff7a;
231
- --magritte-color-component-checkable-icon-checked-v18-1-1:#ffffff;
232
- --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1:#EEF1F7;
233
- --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
234
- --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#ffffff;
245
+ --magritte-color-component-checkable-background-unchecked-v18-1-2:#ffffff;
246
+ --magritte-color-component-checkable-background-checked-v18-1-2:#0070ff;
247
+ --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2:#ffffff;
248
+ --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2:#ffffff;
249
+ --magritte-color-component-checkable-background-state-checked-hovered-v18-1-2:#2b7fff;
250
+ --magritte-color-component-checkable-background-state-checked-disabled-v18-1-2:#CCD5DF;
251
+ --magritte-color-component-checkable-stroke-unchecked-v18-1-2:#DCE3EB;
252
+ --magritte-color-component-checkable-stroke-checked-v18-1-2:#0070ff;
253
+ --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2:#CCD5DF;
254
+ --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2:#2b7fff;
255
+ --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2:#EEF1F7;
256
+ --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2:#CCD5DF;
257
+ --magritte-color-component-checkable-stroke-state-invalid-v18-1-2:#ff4d3a;
258
+ --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2:#ff4d3a7a;
259
+ --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2:#0070ff7a;
260
+ --magritte-color-component-checkable-icon-checked-v18-1-2:#ffffff;
261
+ --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2:#EEF1F7;
262
+ --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2:#ffffff;
263
+ --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2:#ffffff;
235
264
  }
236
265
  :root{
237
- --magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1:cubic-bezier(0.25, 0.1, 0.25, 1);
238
- --magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1:200ms;
239
- --magritte-core-border-radius-1-x-v18-1-1:4px;
266
+ --magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2:cubic-bezier(0.25, 0.1, 0.25, 1);
267
+ --magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2:200ms;
268
+ --magritte-core-border-radius-1-x-v18-1-2:4px;
240
269
  }
241
270
  .magritte-night-theme{
242
- --magritte-color-component-checkable-background-unchecked-v18-1-1:#1B1B1B;
243
- --magritte-color-component-checkable-background-checked-v18-1-1:#2b7fff;
244
- --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1:#262626;
245
- --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1:#1B1B1B;
246
- --magritte-color-component-checkable-background-state-checked-hovered-v18-1-1:#468ffd;
247
- --magritte-color-component-checkable-background-state-checked-disabled-v18-1-1:#303030;
248
- --magritte-color-component-checkable-stroke-unchecked-v18-1-1:#303030;
249
- --magritte-color-component-checkable-stroke-checked-v18-1-1:#2b7fff;
250
- --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1:#3B3B3B;
251
- --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1:#468ffd;
252
- --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1:#303030;
253
- --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1:#303030;
254
- --magritte-color-component-checkable-stroke-state-invalid-v18-1-1:#ff4d3a;
255
- --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1:#ff4d3a7a;
256
- --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1:#0070ff7a;
257
- --magritte-color-component-checkable-icon-checked-v18-1-1:#ffffff;
258
- --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1:#303030;
259
- --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1:#ffffff;
260
- --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1:#919191;
261
- }
262
- .magritte-radio_container___FI0P7_2-1-5{
271
+ --magritte-color-component-checkable-background-unchecked-v18-1-2:#1B1B1B;
272
+ --magritte-color-component-checkable-background-checked-v18-1-2:#2b7fff;
273
+ --magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2:#262626;
274
+ --magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2:#1B1B1B;
275
+ --magritte-color-component-checkable-background-state-checked-hovered-v18-1-2:#468ffd;
276
+ --magritte-color-component-checkable-background-state-checked-disabled-v18-1-2:#303030;
277
+ --magritte-color-component-checkable-stroke-unchecked-v18-1-2:#303030;
278
+ --magritte-color-component-checkable-stroke-checked-v18-1-2:#2b7fff;
279
+ --magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2:#3B3B3B;
280
+ --magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2:#468ffd;
281
+ --magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2:#303030;
282
+ --magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2:#303030;
283
+ --magritte-color-component-checkable-stroke-state-invalid-v18-1-2:#ff4d3a;
284
+ --magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2:#ff4d3a7a;
285
+ --magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2:#0070ff7a;
286
+ --magritte-color-component-checkable-icon-checked-v18-1-2:#ffffff;
287
+ --magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2:#303030;
288
+ --magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2:#ffffff;
289
+ --magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2:#919191;
290
+ }
291
+ .magritte-radio_container___FI0P7_2-2-1{
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-5{
302
+ .magritte-radio_input___-puK7_2-2-1{
274
303
  cursor:inherit;
275
304
  position:absolute;
276
305
  opacity:0;
@@ -282,124 +311,142 @@
282
311
  padding:0;
283
312
  z-index:1;
284
313
  }
285
- .magritte-radio_input___-puK7_2-1-5.focus-visible:not([data-focus-visible-skip]) + .magritte-radio___diMe7_2-1-5{
286
- outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-1);
314
+ .magritte-radio_input___-puK7_2-2-1.focus-visible:not([data-focus-visible-skip]) + .magritte-radio___diMe7_2-2-1{
315
+ outline:4px solid var(--magritte-color-component-checkable-stroke-state-accent-focused-accessible-v18-1-2);
287
316
  }
288
- .magritte-radio___diMe7_2-1-5{
317
+ .magritte-radio___diMe7_2-2-1{
289
318
  width:20px;
290
319
  height:20px;
291
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
292
- border:1.5px solid var(--magritte-color-component-checkable-stroke-unchecked-v18-1-1);
320
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
321
+ border:1.5px solid var(--magritte-color-component-checkable-stroke-unchecked-v18-1-2);
293
322
  box-sizing:border-box;
294
- border-radius:var(--magritte-core-border-radius-1-x-v18-1-1);
323
+ border-radius:var(--magritte-core-border-radius-1-x-v18-1-2);
295
324
  display:flex;
296
325
  align-items:center;
297
326
  justify-content:center;
298
327
  transition-property:background-color, border-color;
299
- transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
300
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
328
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2);
329
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2);
301
330
  }
302
- .magritte-icon_wrapper___qj1JL_2-1-5{
331
+ .magritte-icon_wrapper___qj1JL_2-2-1{
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;
308
- transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-1);
309
- transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-1);
339
+ transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v18-1-2);
340
+ transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v18-1-2);
310
341
  opacity:0;
311
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
342
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
312
343
  }
313
- .magritte-radio_input___-puK7_2-1-5:checked + .magritte-radio___diMe7_2-1-5{
314
- background-color:var(--magritte-color-component-checkable-background-checked-v18-1-1);
315
- border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-1);
344
+ .magritte-radio_input___-puK7_2-2-1:checked + .magritte-radio___diMe7_2-2-1{
345
+ background-color:var(--magritte-color-component-checkable-background-checked-v18-1-2);
346
+ border-color:var(--magritte-color-component-checkable-stroke-checked-v18-1-2);
316
347
  }
317
- .magritte-radio_input___-puK7_2-1-5:checked ~ .magritte-icon_wrapper___qj1JL_2-1-5{
348
+ .magritte-radio_input___-puK7_2-2-1:checked ~ .magritte-icon_wrapper___qj1JL_2-2-1{
318
349
  opacity:1;
319
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-1);
350
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-checked-v18-1-2);
320
351
  }
321
- .magritte-radio_input___-puK7_2-1-5 + .magritte-invalid___1vONj_2-1-5{
322
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
323
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
352
+ .magritte-radio_input___-puK7_2-2-1 + .magritte-invalid___1vONj_2-2-1{
353
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
354
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
324
355
  }
325
- .magritte-radio_input___-puK7_2-1-5.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___1vONj_2-1-5{
326
- background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-1);
327
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
328
- outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-1);
356
+ .magritte-radio_input___-puK7_2-2-1.focus-visible:not([data-focus-visible-skip]) + .magritte-invalid___1vONj_2-2-1{
357
+ background-color:var(--magritte-color-component-checkable-background-unchecked-v18-1-2);
358
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
359
+ outline:4px solid var(--magritte-color-component-checkable-stroke-state-negative-focused-accessible-v18-1-2);
329
360
  }
330
- .magritte-radio_input___-puK7_2-1-5:disabled:checked + .magritte-radio___diMe7_2-1-5{
331
- background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-1);
332
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-1);
361
+ .magritte-radio_input___-puK7_2-2-1:disabled:checked + .magritte-radio___diMe7_2-2-1{
362
+ background-color:var(--magritte-color-component-checkable-background-state-checked-disabled-v18-1-2);
363
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-disabled-v18-1-2);
333
364
  }
334
- .magritte-radio_input___-puK7_2-1-5:disabled:checked ~ .magritte-icon_wrapper___qj1JL_2-1-5{
365
+ .magritte-radio_input___-puK7_2-2-1:disabled:checked ~ .magritte-icon_wrapper___qj1JL_2-2-1{
335
366
  opacity:1;
336
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-1);
367
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-disabled-v18-1-2);
337
368
  }
338
- .magritte-radio_input___-puK7_2-1-5:disabled{
369
+ .magritte-radio_input___-puK7_2-2-1:disabled{
339
370
  cursor:not-allowed;
340
371
  }
341
- .magritte-radio_input___-puK7_2-1-5:disabled + .magritte-radio___diMe7_2-1-5{
342
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-1);
343
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-1);
372
+ .magritte-radio_input___-puK7_2-2-1:disabled + .magritte-radio___diMe7_2-2-1{
373
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-disabled-v18-1-2);
374
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-disabled-v18-1-2);
344
375
  }
345
- .magritte-radio_input___-puK7_2-1-5:disabled ~ .magritte-icon_wrapper___qj1JL_2-1-5{
376
+ .magritte-radio_input___-puK7_2-2-1:disabled ~ .magritte-icon_wrapper___qj1JL_2-2-1{
346
377
  opacity:0;
347
378
  }
348
379
  @media (min-width: 1020px){
349
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-5:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-1-5{
350
- background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
351
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
380
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
381
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
382
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
352
383
  }
353
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-5:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-5{
384
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
354
385
  opacity:1;
355
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
386
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
356
387
  }
357
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) + .magritte-radio___diMe7_2-1-5{
358
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
359
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
388
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:indeterminate:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
389
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
390
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
360
391
  }
361
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) + .magritte-invalid___1vONj_2-1-5{
362
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
363
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
392
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
393
+ opacity:1;
394
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
364
395
  }
365
- body.magritte-old-layout .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-5{
396
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
397
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
398
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2);
399
+ }
400
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) + .magritte-invalid___1vONj_2-2-1{
401
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
402
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
403
+ }
404
+ body.magritte-old-layout .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
366
405
  opacity:1;
367
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
406
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
368
407
  }
369
408
  }
370
409
  @media (min-width: 1024px){
371
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-5:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-1-5{
372
- background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-1);
373
- border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-1);
410
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:checked:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
411
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
412
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
413
+ }
414
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
415
+ opacity:1;
416
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
417
+ }
418
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:indeterminate:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
419
+ background-color:var(--magritte-color-component-checkable-background-state-checked-hovered-v18-1-2);
420
+ border-color:var(--magritte-color-component-checkable-stroke-state-checked-hovered-v18-1-2);
374
421
  }
375
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-5:checked:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-5{
422
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:indeterminate:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
376
423
  opacity:1;
377
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-1);
424
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-checked-hovered-v18-1-2);
378
425
  }
379
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) + .magritte-radio___diMe7_2-1-5{
380
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
381
- border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-1);
426
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) + .magritte-radio___diMe7_2-2-1{
427
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
428
+ border-color:var(--magritte-color-component-checkable-stroke-state-unchecked-hovered-v18-1-2);
382
429
  }
383
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) + .magritte-invalid___1vONj_2-1-5{
384
- background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-1);
385
- border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-1);
430
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) + .magritte-invalid___1vONj_2-2-1{
431
+ background-color:var(--magritte-color-component-checkable-background-state-unchecked-hovered-v18-1-2);
432
+ border-color:var(--magritte-color-component-checkable-stroke-state-invalid-v18-1-2);
386
433
  }
387
- body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-1-5:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-1-5{
434
+ body:not(.magritte-old-layout) .magritte-radio_input___-puK7_2-2-1:hover:not(:disabled) ~ .magritte-icon_wrapper___qj1JL_2-2-1{
388
435
  opacity:1;
389
- --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-1);
436
+ --magritte-ui-icon-color-override:var(--magritte-color-component-checkable-icon-state-unchecked-hovered-v18-1-2);
390
437
  }
391
438
  }
392
- .magritte-radio___diMe7_2-1-5{
439
+ .magritte-radio___diMe7_2-2-1{
393
440
  border-radius:50%;
394
441
  }
395
- .magritte-radio-skeleton-container___GjZez_2-1-5{
442
+ .magritte-radio-skeleton-container___GjZez_2-2-1{
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-5{
449
+ .magritte-radio-skeleton___9TSLy_2-2-1{
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-3ffbf900.js';
10
+ import './CheckboxSkeleton-7b05ddc6.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-a756c251.js';
14
+ import './RadioSkeleton-dc4ff11e.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.5",
3
+ "version": "2.2.1",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -21,12 +21,12 @@
21
21
  "dependencies": {
22
22
  "@hh.ru/magritte-common-use-disabled": "1.0.8",
23
23
  "@hh.ru/magritte-common-use-loading-state": "1.0.4",
24
- "@hh.ru/magritte-design-tokens": "18.1.1",
24
+ "@hh.ru/magritte-design-tokens": "18.1.2",
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.4",
28
- "@hh.ru/magritte-ui-skeleton": "2.1.2",
29
- "@hh.ru/magritte-ui-theme-provider": "1.1.21"
27
+ "@hh.ru/magritte-ui-icon": "7.1.5",
28
+ "@hh.ru/magritte-ui-skeleton": "2.1.3",
29
+ "@hh.ru/magritte-ui-theme-provider": "1.1.22"
30
30
  },
31
31
  "peerDependencies": {
32
32
  "classnames": ">=2.3.2",
@@ -35,5 +35,5 @@
35
35
  "publishConfig": {
36
36
  "access": "public"
37
37
  },
38
- "gitHead": "2cb1607215544b6003e0486f5b72e463309a5bee"
38
+ "gitHead": "f983d20d02117bd1e412d635d854ab7c47492692"
39
39
  }