@hh.ru/magritte-ui-avatar 5.0.19 → 5.1.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.
package/Avatar.js CHANGED
@@ -7,12 +7,12 @@ import { Female } from './Placeholder/Female.js';
7
7
  import { Male } from './Placeholder/Male.js';
8
8
  import { City } from './Placeholder/City.js';
9
9
  import { Undefined } from './Placeholder/Undefined.js';
10
- import { A as AvatarSkeleton, s as styles } from './Skeleton-U-xqNx9I.js';
10
+ import { A as AvatarSkeleton, s as styles } from './Skeleton-CJIkCUza.js';
11
11
  import { AVATAR_TYPOGRAPHY_MAP, formatLetters } from './utils.js';
12
12
  import { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';
13
13
  import { BaseText } from '@hh.ru/magritte-ui-typography/BaseText';
14
14
 
15
- const AvatarForwardRefRenderFunc = ({ mode, size, 'aria-label': ariaLabel, shapeCircle = false, online = false, disabled = false, letters, style, icon, image, fallbackMode, placeholder = 'undefined', Element = 'div', containerDataQa = '', ...avatarProps }, ref) => {
15
+ const AvatarForwardRefRenderFunc = ({ mode, size, 'aria-label': ariaLabel, shapeCircle = false, online = false, styleOnline = 'positive', disabled = false, letters, style, icon, image, fallbackMode, placeholder = 'undefined', Element = 'div', containerDataQa = '', ...avatarProps }, ref) => {
16
16
  const [isImageLoaded, setLoaded] = useState(false);
17
17
  const imgRef = useRef(null);
18
18
  const forceDisabled = useDisabled();
@@ -69,7 +69,7 @@ const AvatarForwardRefRenderFunc = ({ mode, size, 'aria-label': ariaLabel, shape
69
69
  [styles[`avatar-container_size-${size}`]]: online,
70
70
  }),
71
71
  }
72
- : {}), ...(containerDataQa ? { 'data-qa': containerDataQa } : {}), children: [jsxs(Element, { ...additionalAttributes, ...avatarProps, className: classnames(classNames), disabled: Element === 'button' ? isComponentDisabled : false, "aria-label": ariaLabel, children: [isModeLetters && (jsx(BaseText, { style: "primary", Element: "span", typography: AVATAR_TYPOGRAPHY_MAP[size], children: formatLetters(letters || '') })), isModeIcon && icon, isModePlaceholder && (jsxs(Fragment, { children: [placeholder === 'female' && jsx(Female, { role: "img", width: size, height: size }), placeholder === 'male' && jsx(Male, { role: "img", width: size, height: size }), placeholder === 'city' && jsx(City, { role: "img", width: size, height: size }), placeholder === 'undefined' && jsx(Undefined, { role: "img", width: size, height: size })] })), isModeImage && (jsx("img", { ref: imgRef, alt: ariaLabel, className: classnames(styles.avatarImage, { [styles.avatarImageHidden]: !isImageLoaded }) }))] }), online && (jsxs(Fragment, { children: [jsx("div", { className: styles[`avatar-focus-border-${size}`] }), jsx("div", { className: styles[`avatar-online-badge-${size}`] })] }))] }));
72
+ : {}), ...(containerDataQa ? { 'data-qa': containerDataQa } : {}), children: [jsxs(Element, { ...additionalAttributes, ...avatarProps, className: classnames(classNames), disabled: Element === 'button' ? isComponentDisabled : false, "aria-label": ariaLabel, children: [isModeLetters && (jsx(BaseText, { style: "primary", Element: "span", typography: AVATAR_TYPOGRAPHY_MAP[size], children: formatLetters(letters || '') })), isModeIcon && icon, isModePlaceholder && (jsxs(Fragment, { children: [placeholder === 'female' && jsx(Female, { role: "img", width: size, height: size }), placeholder === 'male' && jsx(Male, { role: "img", width: size, height: size }), placeholder === 'city' && jsx(City, { role: "img", width: size, height: size }), placeholder === 'undefined' && jsx(Undefined, { role: "img", width: size, height: size })] })), isModeImage && (jsx("img", { ref: imgRef, alt: ariaLabel, className: classnames(styles.avatarImage, { [styles.avatarImageHidden]: !isImageLoaded }) }))] }), online && (jsxs(Fragment, { children: [jsx("div", { className: styles[`avatar-focus-border-${size}`] }), jsx("div", { className: classnames(styles[`avatar-online-badge-${size}`], styles[`avatar-online-badge_style_${styleOnline}`]) })] }))] }));
73
73
  };
74
74
  const AvatarComponent = forwardRef(AvatarForwardRefRenderFunc);
75
75
  const Avatar = enrichWithSkeleton(AvatarComponent, AvatarSkeleton);
package/Avatar.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.js","sources":["../src/Avatar.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport type { PolymorphicForwardRefRenderFunc, PolymorphicComponentWithRef } from '@hh.ru/magritte-types';\nimport { City, Female, Male, Undefined } from '@hh.ru/magritte-ui-avatar/Placeholder';\nimport { AvatarSkeleton } from '@hh.ru/magritte-ui-avatar/Skeleton';\nimport type { AvatarProps } from '@hh.ru/magritte-ui-avatar/types';\nimport { AVATAR_TYPOGRAPHY_MAP, formatLetters } from '@hh.ru/magritte-ui-avatar/utils';\nimport { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';\nimport { BaseText } from '@hh.ru/magritte-ui-typography/BaseText';\n\nimport styles from './avatar.less';\n\nconst AvatarForwardRefRenderFunc: PolymorphicForwardRefRenderFunc<AvatarProps, 'div'> = (\n {\n mode,\n size,\n 'aria-label': ariaLabel,\n shapeCircle = false,\n online = false,\n disabled = false,\n letters,\n style,\n icon,\n image,\n fallbackMode,\n placeholder = 'undefined',\n Element = 'div',\n containerDataQa = '',\n ...avatarProps\n },\n ref\n) => {\n const [isImageLoaded, setLoaded] = useState(false);\n const imgRef = useRef<HTMLImageElement>(null);\n\n const forceDisabled = useDisabled();\n\n const isComponentDisabled = disabled || forceDisabled;\n\n const isModeLetters = mode === 'letters' || (mode === 'image' && fallbackMode === 'letters' && !isImageLoaded);\n const isModeIcon = mode === 'icon';\n const isModePlaceholder =\n mode === 'placeholder' || (mode === 'image' && fallbackMode === 'placeholder' && !isImageLoaded);\n const isModeImage = mode === 'image';\n\n const additionalAttributes: Record<string, unknown> = {};\n\n if (Element === 'button') {\n additionalAttributes.type = 'button';\n }\n\n if (isComponentDisabled && Element === 'a') {\n additionalAttributes['aria-disabled'] = true;\n additionalAttributes.tabIndex = -1;\n }\n\n if (ref) {\n additionalAttributes.ref = ref;\n }\n\n const classNames = {\n [styles.avatar]: true,\n [styles.avatarShapeCircle]: shapeCircle,\n [styles.avatarModeImage]: mode === 'image' && isImageLoaded,\n [styles.avatarModeLetters]: isModeLetters,\n [styles.avatarModeIcon]: isModeIcon,\n [styles.avatarModePlaceholder]: isModePlaceholder,\n [styles[`avatar_size-${size}`]]: !!size,\n [styles[`avatar_with-online-badge-${size}`]]: online,\n };\n\n if ((isModeLetters || isModeIcon) && style) {\n classNames[styles[`avatar_style-${style}`]] = !!style;\n }\n\n useLayoutEffect(() => {\n const handleOnLoad = () => setLoaded(true);\n const handleOnError = () => setLoaded(false);\n\n const listenOn = imgRef.current;\n if (imgRef.current && image) {\n imgRef.current.addEventListener('load', handleOnLoad);\n imgRef.current.addEventListener('error', handleOnError);\n imgRef.current.src = image;\n }\n\n return () => {\n if (listenOn) {\n listenOn.removeEventListener('load', handleOnLoad);\n listenOn.removeEventListener('error', handleOnError);\n }\n };\n }, [image]);\n\n return (\n <div\n {...(online || isComponentDisabled\n ? {\n className: classnames({\n [styles.avatarContainer]: online,\n [styles.avatarContainerDisabled]: isComponentDisabled,\n [styles[`avatar-container_size-${size}`]]: online,\n }),\n }\n : {})}\n {...(containerDataQa ? { 'data-qa': containerDataQa } : {})}\n >\n <Element\n {...additionalAttributes}\n {...avatarProps}\n className={classnames(classNames)}\n disabled={Element === 'button' ? isComponentDisabled : false}\n aria-label={ariaLabel}\n >\n {isModeLetters && (\n <BaseText style=\"primary\" Element=\"span\" typography={AVATAR_TYPOGRAPHY_MAP[size]}>\n {formatLetters(letters || '')}\n </BaseText>\n )}\n {isModeIcon && icon}\n {isModePlaceholder && (\n <>\n {placeholder === 'female' && <Female role=\"img\" width={size} height={size} />}\n {placeholder === 'male' && <Male role=\"img\" width={size} height={size} />}\n {placeholder === 'city' && <City role=\"img\" width={size} height={size} />}\n {placeholder === 'undefined' && <Undefined role=\"img\" width={size} height={size} />}\n </>\n )}\n {isModeImage && (\n <img\n ref={imgRef}\n alt={ariaLabel}\n className={classnames(styles.avatarImage, { [styles.avatarImageHidden]: !isImageLoaded })}\n />\n )}\n </Element>\n {online && (\n <>\n <div className={styles[`avatar-focus-border-${size}`]} />\n <div className={styles[`avatar-online-badge-${size}`]} />\n </>\n )}\n </div>\n );\n};\n\nconst AvatarComponent: PolymorphicComponentWithRef<AvatarProps, 'div'> = forwardRef(AvatarForwardRefRenderFunc);\n\nexport const Avatar = enrichWithSkeleton(AvatarComponent, AvatarSkeleton);\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"Avatar.js","sources":["../src/Avatar.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport type { PolymorphicForwardRefRenderFunc, PolymorphicComponentWithRef } from '@hh.ru/magritte-types';\nimport { City, Female, Male, Undefined } from '@hh.ru/magritte-ui-avatar/Placeholder';\nimport { AvatarSkeleton } from '@hh.ru/magritte-ui-avatar/Skeleton';\nimport type { AvatarProps } from '@hh.ru/magritte-ui-avatar/types';\nimport { AVATAR_TYPOGRAPHY_MAP, formatLetters } from '@hh.ru/magritte-ui-avatar/utils';\nimport { enrichWithSkeleton } from '@hh.ru/magritte-ui-skeleton';\nimport { BaseText } from '@hh.ru/magritte-ui-typography/BaseText';\n\nimport styles from './avatar.less';\n\nconst AvatarForwardRefRenderFunc: PolymorphicForwardRefRenderFunc<AvatarProps, 'div'> = (\n {\n mode,\n size,\n 'aria-label': ariaLabel,\n shapeCircle = false,\n online = false,\n styleOnline = 'positive',\n disabled = false,\n letters,\n style,\n icon,\n image,\n fallbackMode,\n placeholder = 'undefined',\n Element = 'div',\n containerDataQa = '',\n ...avatarProps\n },\n ref\n) => {\n const [isImageLoaded, setLoaded] = useState(false);\n const imgRef = useRef<HTMLImageElement>(null);\n\n const forceDisabled = useDisabled();\n\n const isComponentDisabled = disabled || forceDisabled;\n\n const isModeLetters = mode === 'letters' || (mode === 'image' && fallbackMode === 'letters' && !isImageLoaded);\n const isModeIcon = mode === 'icon';\n const isModePlaceholder =\n mode === 'placeholder' || (mode === 'image' && fallbackMode === 'placeholder' && !isImageLoaded);\n const isModeImage = mode === 'image';\n\n const additionalAttributes: Record<string, unknown> = {};\n\n if (Element === 'button') {\n additionalAttributes.type = 'button';\n }\n\n if (isComponentDisabled && Element === 'a') {\n additionalAttributes['aria-disabled'] = true;\n additionalAttributes.tabIndex = -1;\n }\n\n if (ref) {\n additionalAttributes.ref = ref;\n }\n\n const classNames = {\n [styles.avatar]: true,\n [styles.avatarShapeCircle]: shapeCircle,\n [styles.avatarModeImage]: mode === 'image' && isImageLoaded,\n [styles.avatarModeLetters]: isModeLetters,\n [styles.avatarModeIcon]: isModeIcon,\n [styles.avatarModePlaceholder]: isModePlaceholder,\n [styles[`avatar_size-${size}`]]: !!size,\n [styles[`avatar_with-online-badge-${size}`]]: online,\n };\n\n if ((isModeLetters || isModeIcon) && style) {\n classNames[styles[`avatar_style-${style}`]] = !!style;\n }\n\n useLayoutEffect(() => {\n const handleOnLoad = () => setLoaded(true);\n const handleOnError = () => setLoaded(false);\n\n const listenOn = imgRef.current;\n if (imgRef.current && image) {\n imgRef.current.addEventListener('load', handleOnLoad);\n imgRef.current.addEventListener('error', handleOnError);\n imgRef.current.src = image;\n }\n\n return () => {\n if (listenOn) {\n listenOn.removeEventListener('load', handleOnLoad);\n listenOn.removeEventListener('error', handleOnError);\n }\n };\n }, [image]);\n\n return (\n <div\n {...(online || isComponentDisabled\n ? {\n className: classnames({\n [styles.avatarContainer]: online,\n [styles.avatarContainerDisabled]: isComponentDisabled,\n [styles[`avatar-container_size-${size}`]]: online,\n }),\n }\n : {})}\n {...(containerDataQa ? { 'data-qa': containerDataQa } : {})}\n >\n <Element\n {...additionalAttributes}\n {...avatarProps}\n className={classnames(classNames)}\n disabled={Element === 'button' ? isComponentDisabled : false}\n aria-label={ariaLabel}\n >\n {isModeLetters && (\n <BaseText style=\"primary\" Element=\"span\" typography={AVATAR_TYPOGRAPHY_MAP[size]}>\n {formatLetters(letters || '')}\n </BaseText>\n )}\n {isModeIcon && icon}\n {isModePlaceholder && (\n <>\n {placeholder === 'female' && <Female role=\"img\" width={size} height={size} />}\n {placeholder === 'male' && <Male role=\"img\" width={size} height={size} />}\n {placeholder === 'city' && <City role=\"img\" width={size} height={size} />}\n {placeholder === 'undefined' && <Undefined role=\"img\" width={size} height={size} />}\n </>\n )}\n {isModeImage && (\n <img\n ref={imgRef}\n alt={ariaLabel}\n className={classnames(styles.avatarImage, { [styles.avatarImageHidden]: !isImageLoaded })}\n />\n )}\n </Element>\n {online && (\n <>\n <div className={styles[`avatar-focus-border-${size}`]} />\n <div\n className={classnames(\n styles[`avatar-online-badge-${size}`],\n styles[`avatar-online-badge_style_${styleOnline}`]\n )}\n />\n </>\n )}\n </div>\n );\n};\n\nconst AvatarComponent: PolymorphicComponentWithRef<AvatarProps, 'div'> = forwardRef(AvatarForwardRefRenderFunc);\n\nexport const Avatar = enrichWithSkeleton(AvatarComponent, AvatarSkeleton);\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
@@ -0,0 +1,18 @@
1
+ import './index.css';
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import classnames from 'classnames';
4
+ import { Skeleton } from '@hh.ru/magritte-ui-skeleton';
5
+
6
+ var styles = {"avatar-container":"magritte-avatar-container___jBkeI_5-1-0","avatarContainer":"magritte-avatar-container___jBkeI_5-1-0","avatar-container_disabled":"magritte-avatar-container_disabled___EkG4l_5-1-0","avatarContainerDisabled":"magritte-avatar-container_disabled___EkG4l_5-1-0","avatar":"magritte-avatar___x--BK_5-1-0","avatar-container_size-24":"magritte-avatar-container_size-24___f6DH2_5-1-0","avatarContainerSize24":"magritte-avatar-container_size-24___f6DH2_5-1-0","avatar-skeleton-24":"magritte-avatar-skeleton-24___9hUuj_5-1-0","avatarSkeleton24":"magritte-avatar-skeleton-24___9hUuj_5-1-0","avatar_size-24":"magritte-avatar_size-24___0dAId_5-1-0","avatarSize24":"magritte-avatar_size-24___0dAId_5-1-0","avatar-container_size-40":"magritte-avatar-container_size-40___mVeBD_5-1-0","avatarContainerSize40":"magritte-avatar-container_size-40___mVeBD_5-1-0","avatar-skeleton-40":"magritte-avatar-skeleton-40___ZN6a7_5-1-0","avatarSkeleton40":"magritte-avatar-skeleton-40___ZN6a7_5-1-0","avatar_size-40":"magritte-avatar_size-40___zj3fM_5-1-0","avatarSize40":"magritte-avatar_size-40___zj3fM_5-1-0","avatar-container_size-48":"magritte-avatar-container_size-48___pflud_5-1-0","avatarContainerSize48":"magritte-avatar-container_size-48___pflud_5-1-0","avatar-skeleton-48":"magritte-avatar-skeleton-48___CC-af_5-1-0","avatarSkeleton48":"magritte-avatar-skeleton-48___CC-af_5-1-0","avatar_size-48":"magritte-avatar_size-48___JzITc_5-1-0","avatarSize48":"magritte-avatar_size-48___JzITc_5-1-0","avatar-container_size-96":"magritte-avatar-container_size-96___Up8Hn_5-1-0","avatarContainerSize96":"magritte-avatar-container_size-96___Up8Hn_5-1-0","avatar-skeleton-96":"magritte-avatar-skeleton-96___qYG-Z_5-1-0","avatarSkeleton96":"magritte-avatar-skeleton-96___qYG-Z_5-1-0","avatar_size-96":"magritte-avatar_size-96___5SeO2_5-1-0","avatarSize96":"magritte-avatar_size-96___5SeO2_5-1-0","avatar-container_size-208":"magritte-avatar-container_size-208___k7SkJ_5-1-0","avatarContainerSize208":"magritte-avatar-container_size-208___k7SkJ_5-1-0","avatar-skeleton-208":"magritte-avatar-skeleton-208___ybqJw_5-1-0","avatarSkeleton208":"magritte-avatar-skeleton-208___ybqJw_5-1-0","avatar_size-208":"magritte-avatar_size-208___rzfu3_5-1-0","avatarSize208":"magritte-avatar_size-208___rzfu3_5-1-0","avatar_shape-circle":"magritte-avatar_shape-circle___kEbru_5-1-0","avatarShapeCircle":"magritte-avatar_shape-circle___kEbru_5-1-0","avatar-skeleton-circle":"magritte-avatar-skeleton-circle___rD1E0_5-1-0","avatarSkeletonCircle":"magritte-avatar-skeleton-circle___rD1E0_5-1-0","avatar_style-color-1":"magritte-avatar_style-color-1___xXtkh_5-1-0","avatarStyleColor1":"magritte-avatar_style-color-1___xXtkh_5-1-0","avatar_style-color-2":"magritte-avatar_style-color-2___JraJd_5-1-0","avatarStyleColor2":"magritte-avatar_style-color-2___JraJd_5-1-0","avatar_style-color-3":"magritte-avatar_style-color-3___g29U3_5-1-0","avatarStyleColor3":"magritte-avatar_style-color-3___g29U3_5-1-0","avatar_style-color-4":"magritte-avatar_style-color-4___pHhmj_5-1-0","avatarStyleColor4":"magritte-avatar_style-color-4___pHhmj_5-1-0","avatar_style-color-5":"magritte-avatar_style-color-5___H9Ie3_5-1-0","avatarStyleColor5":"magritte-avatar_style-color-5___H9Ie3_5-1-0","avatar_style-color-6":"magritte-avatar_style-color-6___oODXO_5-1-0","avatarStyleColor6":"magritte-avatar_style-color-6___oODXO_5-1-0","avatar_style-color-7":"magritte-avatar_style-color-7___SfUBl_5-1-0","avatarStyleColor7":"magritte-avatar_style-color-7___SfUBl_5-1-0","avatar_style-color-8":"magritte-avatar_style-color-8___rlI6h_5-1-0","avatarStyleColor8":"magritte-avatar_style-color-8___rlI6h_5-1-0","avatar_style-color-9":"magritte-avatar_style-color-9___XQO4B_5-1-0","avatarStyleColor9":"magritte-avatar_style-color-9___XQO4B_5-1-0","avatar_style-primary":"magritte-avatar_style-primary___SvqU1_5-1-0","avatarStylePrimary":"magritte-avatar_style-primary___SvqU1_5-1-0","avatar_style-secondary":"magritte-avatar_style-secondary___C6MTH_5-1-0","avatarStyleSecondary":"magritte-avatar_style-secondary___C6MTH_5-1-0","avatar_style-tertiary":"magritte-avatar_style-tertiary___3o-90_5-1-0","avatarStyleTertiary":"magritte-avatar_style-tertiary___3o-90_5-1-0","avatar_style-accent":"magritte-avatar_style-accent___LgPSo_5-1-0","avatarStyleAccent":"magritte-avatar_style-accent___LgPSo_5-1-0","avatar_style-positive":"magritte-avatar_style-positive___bDzbE_5-1-0","avatarStylePositive":"magritte-avatar_style-positive___bDzbE_5-1-0","avatar_style-negative":"magritte-avatar_style-negative___xHHQb_5-1-0","avatarStyleNegative":"magritte-avatar_style-negative___xHHQb_5-1-0","avatar_style-warning":"magritte-avatar_style-warning___7kKRS_5-1-0","avatarStyleWarning":"magritte-avatar_style-warning___7kKRS_5-1-0","avatar_style-special":"magritte-avatar_style-special___gLmS0_5-1-0","avatarStyleSpecial":"magritte-avatar_style-special___gLmS0_5-1-0","avatar_style-contrast":"magritte-avatar_style-contrast___zHyp-_5-1-0","avatarStyleContrast":"magritte-avatar_style-contrast___zHyp-_5-1-0","avatar_mode-image":"magritte-avatar_mode-image___02zr1_5-1-0","avatarModeImage":"magritte-avatar_mode-image___02zr1_5-1-0","avatar_mode-letters":"magritte-avatar_mode-letters___ot4qB_5-1-0","avatarModeLetters":"magritte-avatar_mode-letters___ot4qB_5-1-0","avatar_mode-icon":"magritte-avatar_mode-icon___MYrlv_5-1-0","avatarModeIcon":"magritte-avatar_mode-icon___MYrlv_5-1-0","avatar_mode-placeholder":"magritte-avatar_mode-placeholder___6hOu7_5-1-0","avatarModePlaceholder":"magritte-avatar_mode-placeholder___6hOu7_5-1-0","avatar-image":"magritte-avatar-image___05p9Z_5-1-0","avatarImage":"magritte-avatar-image___05p9Z_5-1-0","avatar-image_hidden":"magritte-avatar-image_hidden___DPQBK_5-1-0","avatarImageHidden":"magritte-avatar-image_hidden___DPQBK_5-1-0","avatar_with-online-badge-24":"magritte-avatar_with-online-badge-24___helkM_5-1-0","avatarWithOnlineBadge24":"magritte-avatar_with-online-badge-24___helkM_5-1-0","avatar-online-badge-24":"magritte-avatar-online-badge-24___mjPKB_5-1-0","avatarOnlineBadge24":"magritte-avatar-online-badge-24___mjPKB_5-1-0","avatar-online-badge_style_positive":"magritte-avatar-online-badge_style_positive___jHyv3_5-1-0","avatarOnlineBadgeStylePositive":"magritte-avatar-online-badge_style_positive___jHyv3_5-1-0","avatar-online-badge_style_contrast":"magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0","avatarOnlineBadgeStyleContrast":"magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0","avatar-focus-border-24":"magritte-avatar-focus-border-24___wnJnb_5-1-0","avatarFocusBorder24":"magritte-avatar-focus-border-24___wnJnb_5-1-0","avatar_with-online-badge-40":"magritte-avatar_with-online-badge-40___Tckho_5-1-0","avatarWithOnlineBadge40":"magritte-avatar_with-online-badge-40___Tckho_5-1-0","avatar-online-badge-40":"magritte-avatar-online-badge-40___HRNTS_5-1-0","avatarOnlineBadge40":"magritte-avatar-online-badge-40___HRNTS_5-1-0","avatar-focus-border-40":"magritte-avatar-focus-border-40___Qn9NL_5-1-0","avatarFocusBorder40":"magritte-avatar-focus-border-40___Qn9NL_5-1-0","avatar_with-online-badge-48":"magritte-avatar_with-online-badge-48___BmWaC_5-1-0","avatarWithOnlineBadge48":"magritte-avatar_with-online-badge-48___BmWaC_5-1-0","avatar-online-badge-48":"magritte-avatar-online-badge-48___qPmD8_5-1-0","avatarOnlineBadge48":"magritte-avatar-online-badge-48___qPmD8_5-1-0","avatar-focus-border-48":"magritte-avatar-focus-border-48___Bc-lN_5-1-0","avatarFocusBorder48":"magritte-avatar-focus-border-48___Bc-lN_5-1-0","avatar_with-online-badge-96":"magritte-avatar_with-online-badge-96___r4E42_5-1-0","avatarWithOnlineBadge96":"magritte-avatar_with-online-badge-96___r4E42_5-1-0","avatar-online-badge-96":"magritte-avatar-online-badge-96___d6bm-_5-1-0","avatarOnlineBadge96":"magritte-avatar-online-badge-96___d6bm-_5-1-0","avatar-focus-border-96":"magritte-avatar-focus-border-96___TVpd0_5-1-0","avatarFocusBorder96":"magritte-avatar-focus-border-96___TVpd0_5-1-0","avatar_with-online-badge-208":"magritte-avatar_with-online-badge-208___AS6Lk_5-1-0","avatarWithOnlineBadge208":"magritte-avatar_with-online-badge-208___AS6Lk_5-1-0","avatar-online-badge-208":"magritte-avatar-online-badge-208___m4hXQ_5-1-0","avatarOnlineBadge208":"magritte-avatar-online-badge-208___m4hXQ_5-1-0","avatar-focus-border-208":"magritte-avatar-focus-border-208___V6We2_5-1-0","avatarFocusBorder208":"magritte-avatar-focus-border-208___V6We2_5-1-0"};
7
+
8
+ const AvatarSkeleton = ({ Component: Avatar,
9
+ // skeleton props
10
+ width, height, borderRadius, inline, additionalClass, loading, ...avatarProps }) => {
11
+ return (jsx(Skeleton, { loading: loading, additionalClass: classnames({
12
+ [styles[`avatar-skeleton-${avatarProps.size}`]]: avatarProps.size,
13
+ [styles.avatarSkeletonCircle]: avatarProps.shapeCircle,
14
+ }), children: jsx(Avatar, { ...avatarProps }) }));
15
+ };
16
+
17
+ export { AvatarSkeleton as A, styles as s };
18
+ //# sourceMappingURL=Skeleton-CJIkCUza.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Skeleton-U-xqNx9I.js","sources":["../src/Skeleton.tsx"],"sourcesContent":["import classnames from 'classnames';\n\nimport { AvatarProps } from '@hh.ru/magritte-ui-avatar/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './avatar.less';\n\nexport const AvatarSkeleton: IncompleteSkeletonComponent<AvatarProps> = ({\n Component: Avatar,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...avatarProps\n}) => {\n return (\n <Skeleton\n loading={loading}\n additionalClass={classnames({\n [styles[`avatar-skeleton-${avatarProps.size}`]]: avatarProps.size,\n [styles.avatarSkeletonCircle]: avatarProps.shapeCircle,\n })}\n >\n <Avatar {...avatarProps} />\n </Skeleton>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAOa,cAAc,GAA6C,CAAC,EACrE,SAAS,EAAE,MAAM;AAEjB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,WAAW,EACjB,KAAI;IACD,QACIA,GAAC,CAAA,QAAQ,EACL,EAAA,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,UAAU,CAAC;AACxB,YAAA,CAAC,MAAM,CAAC,CAAmB,gBAAA,EAAA,WAAW,CAAC,IAAI,CAAE,CAAA,CAAC,GAAG,WAAW,CAAC,IAAI;AACjE,YAAA,CAAC,MAAM,CAAC,oBAAoB,GAAG,WAAW,CAAC,WAAW;SACzD,CAAC,EAAA,QAAA,EAEFA,IAAC,MAAM,EAAA,EAAA,GAAK,WAAW,EAAI,CAAA,EAAA,CACpB,EACb;AACN;;;;"}
1
+ {"version":3,"file":"Skeleton-CJIkCUza.js","sources":["../src/Skeleton.tsx"],"sourcesContent":["import classnames from 'classnames';\n\nimport { AvatarProps } from '@hh.ru/magritte-ui-avatar/types';\nimport { IncompleteSkeletonComponent, Skeleton } from '@hh.ru/magritte-ui-skeleton';\n\nimport styles from './avatar.less';\n\nexport const AvatarSkeleton: IncompleteSkeletonComponent<AvatarProps> = ({\n Component: Avatar,\n\n // skeleton props\n width,\n height,\n borderRadius,\n inline,\n additionalClass,\n loading,\n\n ...avatarProps\n}) => {\n return (\n <Skeleton\n loading={loading}\n additionalClass={classnames({\n [styles[`avatar-skeleton-${avatarProps.size}`]]: avatarProps.size,\n [styles.avatarSkeletonCircle]: avatarProps.shapeCircle,\n })}\n >\n <Avatar {...avatarProps} />\n </Skeleton>\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;MAOa,cAAc,GAA6C,CAAC,EACrE,SAAS,EAAE,MAAM;AAEjB;AACA,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,EACN,eAAe,EACf,OAAO,EAEP,GAAG,WAAW,EACjB,KAAI;IACD,QACIA,GAAC,CAAA,QAAQ,EACL,EAAA,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,UAAU,CAAC;AACxB,YAAA,CAAC,MAAM,CAAC,CAAmB,gBAAA,EAAA,WAAW,CAAC,IAAI,CAAE,CAAA,CAAC,GAAG,WAAW,CAAC,IAAI;AACjE,YAAA,CAAC,MAAM,CAAC,oBAAoB,GAAG,WAAW,CAAC,WAAW;SACzD,CAAC,EAAA,QAAA,EAEFA,IAAC,MAAM,EAAA,EAAA,GAAK,WAAW,EAAI,CAAA,EAAA,CACpB,EACb;AACN;;;;"}
package/Skeleton.js CHANGED
@@ -2,5 +2,5 @@ import './index.css';
2
2
  import 'react/jsx-runtime';
3
3
  import 'classnames';
4
4
  import '@hh.ru/magritte-ui-skeleton';
5
- export { A as AvatarSkeleton } from './Skeleton-U-xqNx9I.js';
5
+ export { A as AvatarSkeleton } from './Skeleton-CJIkCUza.js';
6
6
  //# sourceMappingURL=Skeleton.js.map
package/index.css CHANGED
@@ -8,7 +8,8 @@
8
8
  --magritte-color-background-warning-secondary-v20-1-0:#FFF3E6;
9
9
  --magritte-color-background-special-secondary-v20-1-0:#F7F4FF;
10
10
  --magritte-color-background-constant-v20-1-0:#000000;
11
- --magritte-color-component-avatar-online-content-v20-1-0:#0ea658;
11
+ --magritte-color-component-avatar-online-positive-v20-1-0:#0ea658;
12
+ --magritte-color-component-avatar-online-contrast-v20-1-0:#ffffff;
12
13
  --magritte-color-component-avatar-background-color-01-v20-1-0:#96aabb;
13
14
  --magritte-color-component-avatar-background-color-02-v20-1-0:#ff859f;
14
15
  --magritte-color-component-avatar-background-color-03-v20-1-0:#ff8a77;
@@ -318,7 +319,8 @@
318
319
  --magritte-color-background-warning-secondary-v20-1-0:#3D270E;
319
320
  --magritte-color-background-special-secondary-v20-1-0:#2F293C;
320
321
  --magritte-color-background-constant-v20-1-0:#000000;
321
- --magritte-color-component-avatar-online-content-v20-1-0:#0ea658;
322
+ --magritte-color-component-avatar-online-positive-v20-1-0:#0ea658;
323
+ --magritte-color-component-avatar-online-contrast-v20-1-0:#ffffff;
322
324
  --magritte-color-component-avatar-background-color-01-v20-1-0:#96aabb;
323
325
  --magritte-color-component-avatar-background-color-02-v20-1-0:#ff859f;
324
326
  --magritte-color-component-avatar-background-color-03-v20-1-0:#ff8a77;
@@ -601,14 +603,14 @@
601
603
  --magritte-typography-_custom-5-italic-text-transform-v20-1-0:none;
602
604
  --magritte-typography-_custom-5-italic-text-decoration-v20-1-0:none;
603
605
  }
604
- .magritte-avatar-container___jBkeI_5-0-19{
606
+ .magritte-avatar-container___jBkeI_5-1-0{
605
607
  position:relative;
606
608
  }
607
- .magritte-avatar-container_disabled___EkG4l_5-0-19{
609
+ .magritte-avatar-container_disabled___EkG4l_5-1-0{
608
610
  pointer-events:none;
609
611
  opacity:var(--magritte-semantic-opacity-disabled-v20-1-0);
610
612
  }
611
- .magritte-avatar___x--BK_5-0-19{
613
+ .magritte-avatar___x--BK_5-1-0{
612
614
  display:flex;
613
615
  align-items:center;
614
616
  justify-content:center;
@@ -624,21 +626,21 @@
624
626
  --magritte-ui-avatar-placeholder-city:var(--magritte-color-base-white-v20-1-0);
625
627
  --magritte-ui-avatar-placeholder-shadow-city:var(--magritte-color-base-graphite-90-v20-1-0);
626
628
  }
627
- .magritte-avatar___x--BK_5-0-19:not(div){
629
+ .magritte-avatar___x--BK_5-1-0:not(div){
628
630
  cursor:pointer;
629
631
  }
630
- .magritte-avatar___x--BK_5-0-19:focus{
632
+ .magritte-avatar___x--BK_5-1-0:focus{
631
633
  outline:none;
632
634
  }
633
- .magritte-avatar___x--BK_5-0-19.focus-visible{
635
+ .magritte-avatar___x--BK_5-1-0.focus-visible{
634
636
  outline:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
635
637
  }
636
- .magritte-avatar___x--BK_5-0-19:not(div):active{
638
+ .magritte-avatar___x--BK_5-1-0:not(div):active{
637
639
  transform:scale(var(--magritte-semantic-scale-pressed-v20-1-0));
638
640
  transition-duration:var(--magritte-semantic-animation-ease-in-out-tiger-200-duration-v20-1-0);
639
641
  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-tiger-200-timing-function-v20-1-0);
640
642
  }
641
- .magritte-avatar___x--BK_5-0-19::after{
643
+ .magritte-avatar___x--BK_5-1-0::after{
642
644
  content:'';
643
645
  top:0;
644
646
  left:0;
@@ -646,7 +648,7 @@
646
648
  width:100%;
647
649
  height:100%;
648
650
  }
649
- .magritte-night-theme .magritte-avatar___x--BK_5-0-19{
651
+ .magritte-night-theme .magritte-avatar___x--BK_5-1-0{
650
652
  --magritte-ui-avatar-placeholder-background:var(--magritte-color-base-gray-10-v20-1-0);
651
653
  --magritte-ui-avatar-placeholder-body:var(--magritte-color-base-gray-50-v20-1-0);
652
654
  --magritte-ui-avatar-placeholder-clothes:var(--magritte-color-base-gray-40-v20-1-0);
@@ -656,177 +658,181 @@
656
658
  --magritte-ui-avatar-placeholder-city:var(--magritte-color-base-gray-50-v20-1-0);
657
659
  --magritte-ui-avatar-placeholder-shadow-city:var(--magritte-color-base-gray-30-v20-1-0);
658
660
  }
659
- .magritte-avatar-container_size-24___f6DH2_5-0-19,
660
- .magritte-avatar-skeleton-24___9hUuj_5-0-19,
661
- .magritte-avatar_size-24___0dAId_5-0-19{
661
+ .magritte-avatar-container_size-24___f6DH2_5-1-0,
662
+ .magritte-avatar-skeleton-24___9hUuj_5-1-0,
663
+ .magritte-avatar_size-24___0dAId_5-1-0{
662
664
  width:24px;
663
665
  height:24px;
664
666
  border-radius:var(--magritte-static-border-radius-200-v20-1-0);
665
667
  }
666
- .magritte-avatar-container_size-24___f6DH2_5-0-19:after,
667
- .magritte-avatar-skeleton-24___9hUuj_5-0-19:after,
668
- .magritte-avatar_size-24___0dAId_5-0-19:after{
668
+ .magritte-avatar-container_size-24___f6DH2_5-1-0:after,
669
+ .magritte-avatar-skeleton-24___9hUuj_5-1-0:after,
670
+ .magritte-avatar_size-24___0dAId_5-1-0:after{
669
671
  border-radius:var(--magritte-static-border-radius-200-v20-1-0);
670
672
  }
671
- .magritte-avatar-container_size-40___mVeBD_5-0-19,
672
- .magritte-avatar-skeleton-40___ZN6a7_5-0-19,
673
- .magritte-avatar_size-40___zj3fM_5-0-19{
673
+ .magritte-avatar-container_size-40___mVeBD_5-1-0,
674
+ .magritte-avatar-skeleton-40___ZN6a7_5-1-0,
675
+ .magritte-avatar_size-40___zj3fM_5-1-0{
674
676
  width:40px;
675
677
  height:40px;
676
678
  border-radius:var(--magritte-static-border-radius-300-v20-1-0);
677
679
  }
678
- .magritte-avatar-container_size-40___mVeBD_5-0-19:after,
679
- .magritte-avatar-skeleton-40___ZN6a7_5-0-19:after,
680
- .magritte-avatar_size-40___zj3fM_5-0-19:after{
680
+ .magritte-avatar-container_size-40___mVeBD_5-1-0:after,
681
+ .magritte-avatar-skeleton-40___ZN6a7_5-1-0:after,
682
+ .magritte-avatar_size-40___zj3fM_5-1-0:after{
681
683
  border-radius:var(--magritte-static-border-radius-300-v20-1-0);
682
684
  }
683
- .magritte-avatar-container_size-48___pflud_5-0-19,
684
- .magritte-avatar-skeleton-48___CC-af_5-0-19,
685
- .magritte-avatar_size-48___JzITc_5-0-19{
685
+ .magritte-avatar-container_size-48___pflud_5-1-0,
686
+ .magritte-avatar-skeleton-48___CC-af_5-1-0,
687
+ .magritte-avatar_size-48___JzITc_5-1-0{
686
688
  width:48px;
687
689
  height:48px;
688
690
  border-radius:var(--magritte-static-border-radius-300-v20-1-0);
689
691
  }
690
- .magritte-avatar-container_size-48___pflud_5-0-19:after,
691
- .magritte-avatar-skeleton-48___CC-af_5-0-19:after,
692
- .magritte-avatar_size-48___JzITc_5-0-19:after{
692
+ .magritte-avatar-container_size-48___pflud_5-1-0:after,
693
+ .magritte-avatar-skeleton-48___CC-af_5-1-0:after,
694
+ .magritte-avatar_size-48___JzITc_5-1-0:after{
693
695
  border-radius:var(--magritte-static-border-radius-300-v20-1-0);
694
696
  }
695
- .magritte-avatar-container_size-96___Up8Hn_5-0-19,
696
- .magritte-avatar-skeleton-96___qYG-Z_5-0-19,
697
- .magritte-avatar_size-96___5SeO2_5-0-19{
697
+ .magritte-avatar-container_size-96___Up8Hn_5-1-0,
698
+ .magritte-avatar-skeleton-96___qYG-Z_5-1-0,
699
+ .magritte-avatar_size-96___5SeO2_5-1-0{
698
700
  width:96px;
699
701
  height:96px;
700
702
  border-radius:var(--magritte-static-border-radius-600-v20-1-0);
701
703
  }
702
- .magritte-avatar-container_size-96___Up8Hn_5-0-19:after,
703
- .magritte-avatar-skeleton-96___qYG-Z_5-0-19:after,
704
- .magritte-avatar_size-96___5SeO2_5-0-19:after{
704
+ .magritte-avatar-container_size-96___Up8Hn_5-1-0:after,
705
+ .magritte-avatar-skeleton-96___qYG-Z_5-1-0:after,
706
+ .magritte-avatar_size-96___5SeO2_5-1-0:after{
705
707
  border-radius:var(--magritte-static-border-radius-600-v20-1-0);
706
708
  }
707
- .magritte-avatar-container_size-208___k7SkJ_5-0-19,
708
- .magritte-avatar-skeleton-208___ybqJw_5-0-19,
709
- .magritte-avatar_size-208___rzfu3_5-0-19{
709
+ .magritte-avatar-container_size-208___k7SkJ_5-1-0,
710
+ .magritte-avatar-skeleton-208___ybqJw_5-1-0,
711
+ .magritte-avatar_size-208___rzfu3_5-1-0{
710
712
  width:208px;
711
713
  height:208px;
712
714
  border-radius:var(--magritte-static-border-radius-200-v20-1-0);
713
715
  }
714
- .magritte-avatar-container_size-208___k7SkJ_5-0-19:after,
715
- .magritte-avatar-skeleton-208___ybqJw_5-0-19:after,
716
- .magritte-avatar_size-208___rzfu3_5-0-19:after{
716
+ .magritte-avatar-container_size-208___k7SkJ_5-1-0:after,
717
+ .magritte-avatar-skeleton-208___ybqJw_5-1-0:after,
718
+ .magritte-avatar_size-208___rzfu3_5-1-0:after{
717
719
  border-radius:var(--magritte-static-border-radius-200-v20-1-0);
718
720
  }
719
- .magritte-avatar_shape-circle___kEbru_5-0-19,
720
- .magritte-avatar-skeleton-circle___rD1E0_5-0-19{
721
+ .magritte-avatar_shape-circle___kEbru_5-1-0,
722
+ .magritte-avatar-skeleton-circle___rD1E0_5-1-0{
721
723
  border-radius:50%;
722
724
  }
723
- .magritte-avatar_shape-circle___kEbru_5-0-19::after,
724
- .magritte-avatar-skeleton-circle___rD1E0_5-0-19::after{
725
+ .magritte-avatar_shape-circle___kEbru_5-1-0::after,
726
+ .magritte-avatar-skeleton-circle___rD1E0_5-1-0::after{
725
727
  border-radius:50%;
726
728
  }
727
- .magritte-avatar_style-color-1___xXtkh_5-0-19{
729
+ .magritte-avatar_style-color-1___xXtkh_5-1-0{
728
730
  background-color:var(--magritte-color-component-avatar-background-color-01-v20-1-0);
729
731
  }
730
- .magritte-avatar_style-color-2___JraJd_5-0-19{
732
+ .magritte-avatar_style-color-2___JraJd_5-1-0{
731
733
  background-color:var(--magritte-color-component-avatar-background-color-02-v20-1-0);
732
734
  }
733
- .magritte-avatar_style-color-3___g29U3_5-0-19{
735
+ .magritte-avatar_style-color-3___g29U3_5-1-0{
734
736
  background-color:var(--magritte-color-component-avatar-background-color-03-v20-1-0);
735
737
  }
736
- .magritte-avatar_style-color-4___pHhmj_5-0-19{
738
+ .magritte-avatar_style-color-4___pHhmj_5-1-0{
737
739
  background-color:var(--magritte-color-component-avatar-background-color-04-v20-1-0);
738
740
  }
739
- .magritte-avatar_style-color-5___H9Ie3_5-0-19{
741
+ .magritte-avatar_style-color-5___H9Ie3_5-1-0{
740
742
  background-color:var(--magritte-color-component-avatar-background-color-05-v20-1-0);
741
743
  }
742
- .magritte-avatar_style-color-6___oODXO_5-0-19{
744
+ .magritte-avatar_style-color-6___oODXO_5-1-0{
743
745
  background-color:var(--magritte-color-component-avatar-background-color-06-v20-1-0);
744
746
  }
745
- .magritte-avatar_style-color-7___SfUBl_5-0-19{
747
+ .magritte-avatar_style-color-7___SfUBl_5-1-0{
746
748
  background-color:var(--magritte-color-component-avatar-background-color-07-v20-1-0);
747
749
  }
748
- .magritte-avatar_style-color-8___rlI6h_5-0-19{
750
+ .magritte-avatar_style-color-8___rlI6h_5-1-0{
749
751
  background-color:var(--magritte-color-component-avatar-background-color-08-v20-1-0);
750
752
  }
751
- .magritte-avatar_style-color-9___XQO4B_5-0-19{
753
+ .magritte-avatar_style-color-9___XQO4B_5-1-0{
752
754
  background-color:var(--magritte-color-component-avatar-background-color-09-v20-1-0);
753
755
  }
754
- .magritte-avatar_style-primary___SvqU1_5-0-19{
756
+ .magritte-avatar_style-primary___SvqU1_5-1-0{
755
757
  background-color:var(--magritte-color-background-primary-v20-1-0);
756
758
  }
757
- .magritte-avatar_style-secondary___C6MTH_5-0-19{
759
+ .magritte-avatar_style-secondary___C6MTH_5-1-0{
758
760
  background-color:var(--magritte-color-background-secondary-v20-1-0);
759
761
  }
760
- .magritte-avatar_style-tertiary___3o-90_5-0-19{
762
+ .magritte-avatar_style-tertiary___3o-90_5-1-0{
761
763
  background-color:var(--magritte-color-background-tertiary-v20-1-0);
762
764
  }
763
- .magritte-avatar_style-accent___LgPSo_5-0-19{
765
+ .magritte-avatar_style-accent___LgPSo_5-1-0{
764
766
  background-color:var(--magritte-color-background-accent-secondary-v20-1-0);
765
767
  }
766
- .magritte-avatar_style-positive___bDzbE_5-0-19{
768
+ .magritte-avatar_style-positive___bDzbE_5-1-0{
767
769
  background-color:var(--magritte-color-background-positive-secondary-v20-1-0);
768
770
  }
769
- .magritte-avatar_style-negative___xHHQb_5-0-19{
771
+ .magritte-avatar_style-negative___xHHQb_5-1-0{
770
772
  background-color:var(--magritte-color-background-negative-secondary-v20-1-0);
771
773
  }
772
- .magritte-avatar_style-warning___7kKRS_5-0-19{
774
+ .magritte-avatar_style-warning___7kKRS_5-1-0{
773
775
  background-color:var(--magritte-color-background-warning-secondary-v20-1-0);
774
776
  }
775
- .magritte-avatar_style-special___gLmS0_5-0-19{
777
+ .magritte-avatar_style-special___gLmS0_5-1-0{
776
778
  background-color:var(--magritte-color-background-special-secondary-v20-1-0);
777
779
  }
778
- .magritte-avatar_style-contrast___zHyp-_5-0-19{
780
+ .magritte-avatar_style-contrast___zHyp-_5-1-0{
779
781
  background-color:var(--magritte-color-background-constant-v20-1-0);
780
782
  }
781
- .magritte-avatar_mode-image___02zr1_5-0-19::after{
783
+ .magritte-avatar_mode-image___02zr1_5-1-0::after{
782
784
  box-shadow:inset 0 0 0 var(--magritte-semantic-border-width-default-v20-1-0) var(--magritte-color-component-avatar-stroke-image-v20-1-0);
783
785
  }
784
- .magritte-avatar_mode-letters___ot4qB_5-0-19::after{
786
+ .magritte-avatar_mode-letters___ot4qB_5-1-0::after{
785
787
  box-shadow:inset 0 0 0 var(--magritte-semantic-border-width-default-v20-1-0) var(--magritte-color-component-avatar-stroke-letters-v20-1-0);
786
788
  }
787
- .magritte-avatar_mode-icon___MYrlv_5-0-19::after{
789
+ .magritte-avatar_mode-icon___MYrlv_5-1-0::after{
788
790
  box-shadow:inset 0 0 0 var(--magritte-semantic-border-width-default-v20-1-0) var(--magritte-color-component-avatar-stroke-icon-v20-1-0);
789
791
  }
790
- .magritte-avatar_mode-placeholder___6hOu7_5-0-19::after{
792
+ .magritte-avatar_mode-placeholder___6hOu7_5-1-0::after{
791
793
  box-shadow:inset 0 0 0 var(--magritte-semantic-border-width-default-v20-1-0) var(--magritte-color-component-avatar-stroke-placeholder-v20-1-0);
792
794
  }
793
- .magritte-avatar-image___05p9Z_5-0-19{
795
+ .magritte-avatar-image___05p9Z_5-1-0{
794
796
  object-fit:cover;
795
797
  width:100%;
796
798
  height:100%;
797
799
  }
798
- .magritte-avatar-image_hidden___DPQBK_5-0-19{
800
+ .magritte-avatar-image_hidden___DPQBK_5-1-0{
799
801
  display:none;
800
802
  }
801
- .magritte-avatar_with-online-badge-24___helkM_5-0-19{
803
+ .magritte-avatar_with-online-badge-24___helkM_5-1-0{
802
804
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(6px / 2)) calc(100% - calc(6px / 2)), transparent calc(6px / 2 + 1px), #000 0);
803
805
  -webkit-mask-image:var(--transparent-area-mask);
804
806
  mask-image:var(--transparent-area-mask);
805
807
  }
806
- .magritte-avatar_shape-circle___kEbru_5-0-19.magritte-avatar_with-online-badge-24___helkM_5-0-19{
808
+ .magritte-avatar_shape-circle___kEbru_5-1-0.magritte-avatar_with-online-badge-24___helkM_5-1-0{
807
809
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(6px / 2) + 0px)) calc(100% - calc(calc(6px / 2) + 0px)), transparent calc(6px / 2 + 1px), #000 0);
808
810
  -webkit-mask-image:var(--transparent-area-mask);
809
811
  mask-image:var(--transparent-area-mask);
810
812
  }
811
- .magritte-avatar-online-badge-24___mjPKB_5-0-19{
813
+ .magritte-avatar-online-badge-24___mjPKB_5-1-0{
812
814
  position:absolute;
813
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
814
815
  border-radius:50%;
815
816
  width:6px;
816
817
  height:6px;
817
818
  right:0px;
818
819
  bottom:0px;
819
820
  }
820
- .magritte-avatar_shape-circle___kEbru_5-0-19 ~ .magritte-avatar-online-badge-24___mjPKB_5-0-19{
821
+ .magritte-avatar-online-badge_style_positive___jHyv3_5-1-0{
822
+ background-color:var(--magritte-color-component-avatar-online-positive-v20-1-0);
823
+ }
824
+ .magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0{
825
+ background-color:var(--magritte-color-component-avatar-online-contrast-v20-1-0);
826
+ }
827
+ .magritte-avatar_shape-circle___kEbru_5-1-0 ~ .magritte-avatar-online-badge-24___mjPKB_5-1-0{
821
828
  position:absolute;
822
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
823
829
  border-radius:50%;
824
830
  width:6px;
825
831
  height:6px;
826
832
  right:0px;
827
833
  bottom:0px;
828
834
  }
829
- .magritte-avatar___x--BK_5-0-19.focus-visible + .magritte-avatar-focus-border-24___wnJnb_5-0-19{
835
+ .magritte-avatar___x--BK_5-1-0.focus-visible + .magritte-avatar-focus-border-24___wnJnb_5-1-0{
830
836
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(6px / 2) + 4px)) calc(100% - calc(calc(6px / 2) + 4px)), transparent calc(6px / 2 + 1px), #000 0);
831
837
  -webkit-mask-image:var(--transparent-area-mask);
832
838
  mask-image:var(--transparent-area-mask);
@@ -838,7 +844,7 @@
838
844
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
839
845
  border-radius:calc(var(--magritte-static-border-radius-200-v20-1-0) + 4px);
840
846
  }
841
- .magritte-avatar___x--BK_5-0-19.focus-visible.magritte-avatar_shape-circle___kEbru_5-0-19 + .magritte-avatar-focus-border-24___wnJnb_5-0-19{
847
+ .magritte-avatar___x--BK_5-1-0.focus-visible.magritte-avatar_shape-circle___kEbru_5-1-0 + .magritte-avatar-focus-border-24___wnJnb_5-1-0{
842
848
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(calc(6px / 2) + 0px) + 4px)) calc(100% - calc(calc(calc(6px / 2) + 0px) + 4px)), transparent calc(6px / 2 + 1px), #000 0);
843
849
  -webkit-mask-image:var(--transparent-area-mask);
844
850
  mask-image:var(--transparent-area-mask);
@@ -850,35 +856,39 @@
850
856
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
851
857
  border-radius:50%;
852
858
  }
853
- .magritte-avatar_with-online-badge-40___Tckho_5-0-19{
859
+ .magritte-avatar_with-online-badge-40___Tckho_5-1-0{
854
860
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(8px / 2)) calc(100% - calc(8px / 2)), transparent calc(8px / 2 + 2px), #000 0);
855
861
  -webkit-mask-image:var(--transparent-area-mask);
856
862
  mask-image:var(--transparent-area-mask);
857
863
  }
858
- .magritte-avatar_shape-circle___kEbru_5-0-19.magritte-avatar_with-online-badge-40___Tckho_5-0-19{
864
+ .magritte-avatar_shape-circle___kEbru_5-1-0.magritte-avatar_with-online-badge-40___Tckho_5-1-0{
859
865
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(8px / 2) + 2px)) calc(100% - calc(calc(8px / 2) + 2px)), transparent calc(8px / 2 + 2px), #000 0);
860
866
  -webkit-mask-image:var(--transparent-area-mask);
861
867
  mask-image:var(--transparent-area-mask);
862
868
  }
863
- .magritte-avatar-online-badge-40___HRNTS_5-0-19{
869
+ .magritte-avatar-online-badge-40___HRNTS_5-1-0{
864
870
  position:absolute;
865
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
866
871
  border-radius:50%;
867
872
  width:8px;
868
873
  height:8px;
869
874
  right:0px;
870
875
  bottom:0px;
871
876
  }
872
- .magritte-avatar_shape-circle___kEbru_5-0-19 ~ .magritte-avatar-online-badge-40___HRNTS_5-0-19{
877
+ .magritte-avatar-online-badge_style_positive___jHyv3_5-1-0{
878
+ background-color:var(--magritte-color-component-avatar-online-positive-v20-1-0);
879
+ }
880
+ .magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0{
881
+ background-color:var(--magritte-color-component-avatar-online-contrast-v20-1-0);
882
+ }
883
+ .magritte-avatar_shape-circle___kEbru_5-1-0 ~ .magritte-avatar-online-badge-40___HRNTS_5-1-0{
873
884
  position:absolute;
874
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
875
885
  border-radius:50%;
876
886
  width:8px;
877
887
  height:8px;
878
888
  right:2px;
879
889
  bottom:2px;
880
890
  }
881
- .magritte-avatar___x--BK_5-0-19.focus-visible + .magritte-avatar-focus-border-40___Qn9NL_5-0-19{
891
+ .magritte-avatar___x--BK_5-1-0.focus-visible + .magritte-avatar-focus-border-40___Qn9NL_5-1-0{
882
892
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(8px / 2) + 4px)) calc(100% - calc(calc(8px / 2) + 4px)), transparent calc(8px / 2 + 2px), #000 0);
883
893
  -webkit-mask-image:var(--transparent-area-mask);
884
894
  mask-image:var(--transparent-area-mask);
@@ -890,7 +900,7 @@
890
900
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
891
901
  border-radius:calc(var(--magritte-static-border-radius-300-v20-1-0) + 4px);
892
902
  }
893
- .magritte-avatar___x--BK_5-0-19.focus-visible.magritte-avatar_shape-circle___kEbru_5-0-19 + .magritte-avatar-focus-border-40___Qn9NL_5-0-19{
903
+ .magritte-avatar___x--BK_5-1-0.focus-visible.magritte-avatar_shape-circle___kEbru_5-1-0 + .magritte-avatar-focus-border-40___Qn9NL_5-1-0{
894
904
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(calc(8px / 2) + 2px) + 4px)) calc(100% - calc(calc(calc(8px / 2) + 2px) + 4px)), transparent calc(8px / 2 + 2px), #000 0);
895
905
  -webkit-mask-image:var(--transparent-area-mask);
896
906
  mask-image:var(--transparent-area-mask);
@@ -902,35 +912,39 @@
902
912
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
903
913
  border-radius:50%;
904
914
  }
905
- .magritte-avatar_with-online-badge-48___BmWaC_5-0-19{
915
+ .magritte-avatar_with-online-badge-48___BmWaC_5-1-0{
906
916
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(8px / 2)) calc(100% - calc(8px / 2)), transparent calc(8px / 2 + 2px), #000 0);
907
917
  -webkit-mask-image:var(--transparent-area-mask);
908
918
  mask-image:var(--transparent-area-mask);
909
919
  }
910
- .magritte-avatar_shape-circle___kEbru_5-0-19.magritte-avatar_with-online-badge-48___BmWaC_5-0-19{
920
+ .magritte-avatar_shape-circle___kEbru_5-1-0.magritte-avatar_with-online-badge-48___BmWaC_5-1-0{
911
921
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(8px / 2) + 3px)) calc(100% - calc(calc(8px / 2) + 3px)), transparent calc(8px / 2 + 2px), #000 0);
912
922
  -webkit-mask-image:var(--transparent-area-mask);
913
923
  mask-image:var(--transparent-area-mask);
914
924
  }
915
- .magritte-avatar-online-badge-48___qPmD8_5-0-19{
925
+ .magritte-avatar-online-badge-48___qPmD8_5-1-0{
916
926
  position:absolute;
917
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
918
927
  border-radius:50%;
919
928
  width:8px;
920
929
  height:8px;
921
930
  right:0px;
922
931
  bottom:0px;
923
932
  }
924
- .magritte-avatar_shape-circle___kEbru_5-0-19 ~ .magritte-avatar-online-badge-48___qPmD8_5-0-19{
933
+ .magritte-avatar-online-badge_style_positive___jHyv3_5-1-0{
934
+ background-color:var(--magritte-color-component-avatar-online-positive-v20-1-0);
935
+ }
936
+ .magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0{
937
+ background-color:var(--magritte-color-component-avatar-online-contrast-v20-1-0);
938
+ }
939
+ .magritte-avatar_shape-circle___kEbru_5-1-0 ~ .magritte-avatar-online-badge-48___qPmD8_5-1-0{
925
940
  position:absolute;
926
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
927
941
  border-radius:50%;
928
942
  width:8px;
929
943
  height:8px;
930
944
  right:3px;
931
945
  bottom:3px;
932
946
  }
933
- .magritte-avatar___x--BK_5-0-19.focus-visible + .magritte-avatar-focus-border-48___Bc-lN_5-0-19{
947
+ .magritte-avatar___x--BK_5-1-0.focus-visible + .magritte-avatar-focus-border-48___Bc-lN_5-1-0{
934
948
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(8px / 2) + 4px)) calc(100% - calc(calc(8px / 2) + 4px)), transparent calc(8px / 2 + 2px), #000 0);
935
949
  -webkit-mask-image:var(--transparent-area-mask);
936
950
  mask-image:var(--transparent-area-mask);
@@ -942,7 +956,7 @@
942
956
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
943
957
  border-radius:calc(var(--magritte-static-border-radius-300-v20-1-0) + 4px);
944
958
  }
945
- .magritte-avatar___x--BK_5-0-19.focus-visible.magritte-avatar_shape-circle___kEbru_5-0-19 + .magritte-avatar-focus-border-48___Bc-lN_5-0-19{
959
+ .magritte-avatar___x--BK_5-1-0.focus-visible.magritte-avatar_shape-circle___kEbru_5-1-0 + .magritte-avatar-focus-border-48___Bc-lN_5-1-0{
946
960
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(calc(8px / 2) + 3px) + 4px)) calc(100% - calc(calc(calc(8px / 2) + 3px) + 4px)), transparent calc(8px / 2 + 2px), #000 0);
947
961
  -webkit-mask-image:var(--transparent-area-mask);
948
962
  mask-image:var(--transparent-area-mask);
@@ -954,35 +968,39 @@
954
968
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
955
969
  border-radius:50%;
956
970
  }
957
- .magritte-avatar_with-online-badge-96___r4E42_5-0-19{
971
+ .magritte-avatar_with-online-badge-96___r4E42_5-1-0{
958
972
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(12px / 2)) calc(100% - calc(12px / 2)), transparent calc(12px / 2 + 2px), #000 0);
959
973
  -webkit-mask-image:var(--transparent-area-mask);
960
974
  mask-image:var(--transparent-area-mask);
961
975
  }
962
- .magritte-avatar_shape-circle___kEbru_5-0-19.magritte-avatar_with-online-badge-96___r4E42_5-0-19{
976
+ .magritte-avatar_shape-circle___kEbru_5-1-0.magritte-avatar_with-online-badge-96___r4E42_5-1-0{
963
977
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(12px / 2) + 8px)) calc(100% - calc(calc(12px / 2) + 8px)), transparent calc(12px / 2 + 2px), #000 0);
964
978
  -webkit-mask-image:var(--transparent-area-mask);
965
979
  mask-image:var(--transparent-area-mask);
966
980
  }
967
- .magritte-avatar-online-badge-96___d6bm-_5-0-19{
981
+ .magritte-avatar-online-badge-96___d6bm-_5-1-0{
968
982
  position:absolute;
969
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
970
983
  border-radius:50%;
971
984
  width:12px;
972
985
  height:12px;
973
986
  right:0px;
974
987
  bottom:0px;
975
988
  }
976
- .magritte-avatar_shape-circle___kEbru_5-0-19 ~ .magritte-avatar-online-badge-96___d6bm-_5-0-19{
989
+ .magritte-avatar-online-badge_style_positive___jHyv3_5-1-0{
990
+ background-color:var(--magritte-color-component-avatar-online-positive-v20-1-0);
991
+ }
992
+ .magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0{
993
+ background-color:var(--magritte-color-component-avatar-online-contrast-v20-1-0);
994
+ }
995
+ .magritte-avatar_shape-circle___kEbru_5-1-0 ~ .magritte-avatar-online-badge-96___d6bm-_5-1-0{
977
996
  position:absolute;
978
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
979
997
  border-radius:50%;
980
998
  width:12px;
981
999
  height:12px;
982
1000
  right:8px;
983
1001
  bottom:8px;
984
1002
  }
985
- .magritte-avatar___x--BK_5-0-19.focus-visible + .magritte-avatar-focus-border-96___TVpd0_5-0-19{
1003
+ .magritte-avatar___x--BK_5-1-0.focus-visible + .magritte-avatar-focus-border-96___TVpd0_5-1-0{
986
1004
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(12px / 2) + 4px)) calc(100% - calc(calc(12px / 2) + 4px)), transparent calc(12px / 2 + 2px), #000 0);
987
1005
  -webkit-mask-image:var(--transparent-area-mask);
988
1006
  mask-image:var(--transparent-area-mask);
@@ -994,7 +1012,7 @@
994
1012
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
995
1013
  border-radius:calc(var(--magritte-static-border-radius-600-v20-1-0) + 4px);
996
1014
  }
997
- .magritte-avatar___x--BK_5-0-19.focus-visible.magritte-avatar_shape-circle___kEbru_5-0-19 + .magritte-avatar-focus-border-96___TVpd0_5-0-19{
1015
+ .magritte-avatar___x--BK_5-1-0.focus-visible.magritte-avatar_shape-circle___kEbru_5-1-0 + .magritte-avatar-focus-border-96___TVpd0_5-1-0{
998
1016
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(calc(12px / 2) + 8px) + 4px)) calc(100% - calc(calc(calc(12px / 2) + 8px) + 4px)), transparent calc(12px / 2 + 2px), #000 0);
999
1017
  -webkit-mask-image:var(--transparent-area-mask);
1000
1018
  mask-image:var(--transparent-area-mask);
@@ -1006,35 +1024,39 @@
1006
1024
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
1007
1025
  border-radius:50%;
1008
1026
  }
1009
- .magritte-avatar_with-online-badge-208___AS6Lk_5-0-19{
1027
+ .magritte-avatar_with-online-badge-208___AS6Lk_5-1-0{
1010
1028
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(12px / 2)) calc(100% - calc(12px / 2)), transparent calc(12px / 2 + 2px), #000 0);
1011
1029
  -webkit-mask-image:var(--transparent-area-mask);
1012
1030
  mask-image:var(--transparent-area-mask);
1013
1031
  }
1014
- .magritte-avatar_shape-circle___kEbru_5-0-19.magritte-avatar_with-online-badge-208___AS6Lk_5-0-19{
1032
+ .magritte-avatar_shape-circle___kEbru_5-1-0.magritte-avatar_with-online-badge-208___AS6Lk_5-1-0{
1015
1033
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(12px / 2) + 25px)) calc(100% - calc(calc(12px / 2) + 25px)), transparent calc(12px / 2 + 2px), #000 0);
1016
1034
  -webkit-mask-image:var(--transparent-area-mask);
1017
1035
  mask-image:var(--transparent-area-mask);
1018
1036
  }
1019
- .magritte-avatar-online-badge-208___m4hXQ_5-0-19{
1037
+ .magritte-avatar-online-badge-208___m4hXQ_5-1-0{
1020
1038
  position:absolute;
1021
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
1022
1039
  border-radius:50%;
1023
1040
  width:12px;
1024
1041
  height:12px;
1025
1042
  right:0px;
1026
1043
  bottom:0px;
1027
1044
  }
1028
- .magritte-avatar_shape-circle___kEbru_5-0-19 ~ .magritte-avatar-online-badge-208___m4hXQ_5-0-19{
1045
+ .magritte-avatar-online-badge_style_positive___jHyv3_5-1-0{
1046
+ background-color:var(--magritte-color-component-avatar-online-positive-v20-1-0);
1047
+ }
1048
+ .magritte-avatar-online-badge_style_contrast___GZFCO_5-1-0{
1049
+ background-color:var(--magritte-color-component-avatar-online-contrast-v20-1-0);
1050
+ }
1051
+ .magritte-avatar_shape-circle___kEbru_5-1-0 ~ .magritte-avatar-online-badge-208___m4hXQ_5-1-0{
1029
1052
  position:absolute;
1030
- background-color:var(--magritte-color-component-avatar-online-content-v20-1-0);
1031
1053
  border-radius:50%;
1032
1054
  width:12px;
1033
1055
  height:12px;
1034
1056
  right:25px;
1035
1057
  bottom:25px;
1036
1058
  }
1037
- .magritte-avatar___x--BK_5-0-19.focus-visible + .magritte-avatar-focus-border-208___V6We2_5-0-19{
1059
+ .magritte-avatar___x--BK_5-1-0.focus-visible + .magritte-avatar-focus-border-208___V6We2_5-1-0{
1038
1060
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(12px / 2) + 4px)) calc(100% - calc(calc(12px / 2) + 4px)), transparent calc(12px / 2 + 2px), #000 0);
1039
1061
  -webkit-mask-image:var(--transparent-area-mask);
1040
1062
  mask-image:var(--transparent-area-mask);
@@ -1046,7 +1068,7 @@
1046
1068
  border:4px solid var(--magritte-color-component-avatar-stroke-state-focused-accessible-v20-1-0);
1047
1069
  border-radius:calc(var(--magritte-static-border-radius-200-v20-1-0) + 4px);
1048
1070
  }
1049
- .magritte-avatar___x--BK_5-0-19.focus-visible.magritte-avatar_shape-circle___kEbru_5-0-19 + .magritte-avatar-focus-border-208___V6We2_5-0-19{
1071
+ .magritte-avatar___x--BK_5-1-0.focus-visible.magritte-avatar_shape-circle___kEbru_5-1-0 + .magritte-avatar-focus-border-208___V6We2_5-1-0{
1050
1072
  --transparent-area-mask:radial-gradient(circle at calc(100% - calc(calc(calc(12px / 2) + 25px) + 4px)) calc(100% - calc(calc(calc(12px / 2) + 25px) + 4px)), transparent calc(12px / 2 + 2px), #000 0);
1051
1073
  -webkit-mask-image:var(--transparent-area-mask);
1052
1074
  mask-image:var(--transparent-area-mask);
package/index.js CHANGED
@@ -9,7 +9,7 @@ import './Placeholder/Female.js';
9
9
  import './Placeholder/Male.js';
10
10
  import './Placeholder/City.js';
11
11
  import './Placeholder/Undefined.js';
12
- import './Skeleton-U-xqNx9I.js';
12
+ import './Skeleton-CJIkCUza.js';
13
13
  import '@hh.ru/magritte-ui-skeleton';
14
14
  import './utils.js';
15
15
  import '@hh.ru/magritte-ui-typography/BaseText';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-avatar",
3
- "version": "5.0.19",
3
+ "version": "5.1.0",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -35,5 +35,5 @@
35
35
  "publishConfig": {
36
36
  "access": "public"
37
37
  },
38
- "gitHead": "57867dfe289f03cc69932c1de56a3eba0e25a9b4"
38
+ "gitHead": "346881f05e7fdd6b3f25a00a6bd004198be44f87"
39
39
  }
package/types.d.ts CHANGED
@@ -4,6 +4,7 @@ export type AvatarMode = 'letters' | 'icon' | 'placeholder' | 'image';
4
4
  export type AvatarLettersStyle = 'color-1' | 'color-2' | 'color-3' | 'color-4' | 'color-5' | 'color-6' | 'color-7' | 'color-8' | 'color-9';
5
5
  export type AvatarIconStyle = 'primary' | 'secondary' | 'tertiary' | 'accent' | 'positive' | 'negative' | 'warning' | 'special' | 'contrast';
6
6
  export type AvatarPlaceholder = 'female' | 'male' | 'city' | 'undefined';
7
+ export type AvatarOnlineStyle = 'positive' | 'contrast';
7
8
  interface AvatarBaseProps {
8
9
  /** Режим отображения компонента */
9
10
  mode: AvatarMode;
@@ -19,6 +20,8 @@ interface AvatarBaseProps {
19
20
  disabled?: boolean;
20
21
  /** Отображать ли индикатор онлайн */
21
22
  online?: boolean;
23
+ /** Стиль индикатора онлайн */
24
+ styleOnline?: AvatarOnlineStyle;
22
25
  /** data-qa для контейнера аватара */
23
26
  containerDataQa?: string;
24
27
  }
@@ -1,18 +0,0 @@
1
- import './index.css';
2
- import { jsx } from 'react/jsx-runtime';
3
- import classnames from 'classnames';
4
- import { Skeleton } from '@hh.ru/magritte-ui-skeleton';
5
-
6
- var styles = {"avatar-container":"magritte-avatar-container___jBkeI_5-0-19","avatarContainer":"magritte-avatar-container___jBkeI_5-0-19","avatar-container_disabled":"magritte-avatar-container_disabled___EkG4l_5-0-19","avatarContainerDisabled":"magritte-avatar-container_disabled___EkG4l_5-0-19","avatar":"magritte-avatar___x--BK_5-0-19","avatar-container_size-24":"magritte-avatar-container_size-24___f6DH2_5-0-19","avatarContainerSize24":"magritte-avatar-container_size-24___f6DH2_5-0-19","avatar-skeleton-24":"magritte-avatar-skeleton-24___9hUuj_5-0-19","avatarSkeleton24":"magritte-avatar-skeleton-24___9hUuj_5-0-19","avatar_size-24":"magritte-avatar_size-24___0dAId_5-0-19","avatarSize24":"magritte-avatar_size-24___0dAId_5-0-19","avatar-container_size-40":"magritte-avatar-container_size-40___mVeBD_5-0-19","avatarContainerSize40":"magritte-avatar-container_size-40___mVeBD_5-0-19","avatar-skeleton-40":"magritte-avatar-skeleton-40___ZN6a7_5-0-19","avatarSkeleton40":"magritte-avatar-skeleton-40___ZN6a7_5-0-19","avatar_size-40":"magritte-avatar_size-40___zj3fM_5-0-19","avatarSize40":"magritte-avatar_size-40___zj3fM_5-0-19","avatar-container_size-48":"magritte-avatar-container_size-48___pflud_5-0-19","avatarContainerSize48":"magritte-avatar-container_size-48___pflud_5-0-19","avatar-skeleton-48":"magritte-avatar-skeleton-48___CC-af_5-0-19","avatarSkeleton48":"magritte-avatar-skeleton-48___CC-af_5-0-19","avatar_size-48":"magritte-avatar_size-48___JzITc_5-0-19","avatarSize48":"magritte-avatar_size-48___JzITc_5-0-19","avatar-container_size-96":"magritte-avatar-container_size-96___Up8Hn_5-0-19","avatarContainerSize96":"magritte-avatar-container_size-96___Up8Hn_5-0-19","avatar-skeleton-96":"magritte-avatar-skeleton-96___qYG-Z_5-0-19","avatarSkeleton96":"magritte-avatar-skeleton-96___qYG-Z_5-0-19","avatar_size-96":"magritte-avatar_size-96___5SeO2_5-0-19","avatarSize96":"magritte-avatar_size-96___5SeO2_5-0-19","avatar-container_size-208":"magritte-avatar-container_size-208___k7SkJ_5-0-19","avatarContainerSize208":"magritte-avatar-container_size-208___k7SkJ_5-0-19","avatar-skeleton-208":"magritte-avatar-skeleton-208___ybqJw_5-0-19","avatarSkeleton208":"magritte-avatar-skeleton-208___ybqJw_5-0-19","avatar_size-208":"magritte-avatar_size-208___rzfu3_5-0-19","avatarSize208":"magritte-avatar_size-208___rzfu3_5-0-19","avatar_shape-circle":"magritte-avatar_shape-circle___kEbru_5-0-19","avatarShapeCircle":"magritte-avatar_shape-circle___kEbru_5-0-19","avatar-skeleton-circle":"magritte-avatar-skeleton-circle___rD1E0_5-0-19","avatarSkeletonCircle":"magritte-avatar-skeleton-circle___rD1E0_5-0-19","avatar_style-color-1":"magritte-avatar_style-color-1___xXtkh_5-0-19","avatarStyleColor1":"magritte-avatar_style-color-1___xXtkh_5-0-19","avatar_style-color-2":"magritte-avatar_style-color-2___JraJd_5-0-19","avatarStyleColor2":"magritte-avatar_style-color-2___JraJd_5-0-19","avatar_style-color-3":"magritte-avatar_style-color-3___g29U3_5-0-19","avatarStyleColor3":"magritte-avatar_style-color-3___g29U3_5-0-19","avatar_style-color-4":"magritte-avatar_style-color-4___pHhmj_5-0-19","avatarStyleColor4":"magritte-avatar_style-color-4___pHhmj_5-0-19","avatar_style-color-5":"magritte-avatar_style-color-5___H9Ie3_5-0-19","avatarStyleColor5":"magritte-avatar_style-color-5___H9Ie3_5-0-19","avatar_style-color-6":"magritte-avatar_style-color-6___oODXO_5-0-19","avatarStyleColor6":"magritte-avatar_style-color-6___oODXO_5-0-19","avatar_style-color-7":"magritte-avatar_style-color-7___SfUBl_5-0-19","avatarStyleColor7":"magritte-avatar_style-color-7___SfUBl_5-0-19","avatar_style-color-8":"magritte-avatar_style-color-8___rlI6h_5-0-19","avatarStyleColor8":"magritte-avatar_style-color-8___rlI6h_5-0-19","avatar_style-color-9":"magritte-avatar_style-color-9___XQO4B_5-0-19","avatarStyleColor9":"magritte-avatar_style-color-9___XQO4B_5-0-19","avatar_style-primary":"magritte-avatar_style-primary___SvqU1_5-0-19","avatarStylePrimary":"magritte-avatar_style-primary___SvqU1_5-0-19","avatar_style-secondary":"magritte-avatar_style-secondary___C6MTH_5-0-19","avatarStyleSecondary":"magritte-avatar_style-secondary___C6MTH_5-0-19","avatar_style-tertiary":"magritte-avatar_style-tertiary___3o-90_5-0-19","avatarStyleTertiary":"magritte-avatar_style-tertiary___3o-90_5-0-19","avatar_style-accent":"magritte-avatar_style-accent___LgPSo_5-0-19","avatarStyleAccent":"magritte-avatar_style-accent___LgPSo_5-0-19","avatar_style-positive":"magritte-avatar_style-positive___bDzbE_5-0-19","avatarStylePositive":"magritte-avatar_style-positive___bDzbE_5-0-19","avatar_style-negative":"magritte-avatar_style-negative___xHHQb_5-0-19","avatarStyleNegative":"magritte-avatar_style-negative___xHHQb_5-0-19","avatar_style-warning":"magritte-avatar_style-warning___7kKRS_5-0-19","avatarStyleWarning":"magritte-avatar_style-warning___7kKRS_5-0-19","avatar_style-special":"magritte-avatar_style-special___gLmS0_5-0-19","avatarStyleSpecial":"magritte-avatar_style-special___gLmS0_5-0-19","avatar_style-contrast":"magritte-avatar_style-contrast___zHyp-_5-0-19","avatarStyleContrast":"magritte-avatar_style-contrast___zHyp-_5-0-19","avatar_mode-image":"magritte-avatar_mode-image___02zr1_5-0-19","avatarModeImage":"magritte-avatar_mode-image___02zr1_5-0-19","avatar_mode-letters":"magritte-avatar_mode-letters___ot4qB_5-0-19","avatarModeLetters":"magritte-avatar_mode-letters___ot4qB_5-0-19","avatar_mode-icon":"magritte-avatar_mode-icon___MYrlv_5-0-19","avatarModeIcon":"magritte-avatar_mode-icon___MYrlv_5-0-19","avatar_mode-placeholder":"magritte-avatar_mode-placeholder___6hOu7_5-0-19","avatarModePlaceholder":"magritte-avatar_mode-placeholder___6hOu7_5-0-19","avatar-image":"magritte-avatar-image___05p9Z_5-0-19","avatarImage":"magritte-avatar-image___05p9Z_5-0-19","avatar-image_hidden":"magritte-avatar-image_hidden___DPQBK_5-0-19","avatarImageHidden":"magritte-avatar-image_hidden___DPQBK_5-0-19","avatar_with-online-badge-24":"magritte-avatar_with-online-badge-24___helkM_5-0-19","avatarWithOnlineBadge24":"magritte-avatar_with-online-badge-24___helkM_5-0-19","avatar-online-badge-24":"magritte-avatar-online-badge-24___mjPKB_5-0-19","avatarOnlineBadge24":"magritte-avatar-online-badge-24___mjPKB_5-0-19","avatar-focus-border-24":"magritte-avatar-focus-border-24___wnJnb_5-0-19","avatarFocusBorder24":"magritte-avatar-focus-border-24___wnJnb_5-0-19","avatar_with-online-badge-40":"magritte-avatar_with-online-badge-40___Tckho_5-0-19","avatarWithOnlineBadge40":"magritte-avatar_with-online-badge-40___Tckho_5-0-19","avatar-online-badge-40":"magritte-avatar-online-badge-40___HRNTS_5-0-19","avatarOnlineBadge40":"magritte-avatar-online-badge-40___HRNTS_5-0-19","avatar-focus-border-40":"magritte-avatar-focus-border-40___Qn9NL_5-0-19","avatarFocusBorder40":"magritte-avatar-focus-border-40___Qn9NL_5-0-19","avatar_with-online-badge-48":"magritte-avatar_with-online-badge-48___BmWaC_5-0-19","avatarWithOnlineBadge48":"magritte-avatar_with-online-badge-48___BmWaC_5-0-19","avatar-online-badge-48":"magritte-avatar-online-badge-48___qPmD8_5-0-19","avatarOnlineBadge48":"magritte-avatar-online-badge-48___qPmD8_5-0-19","avatar-focus-border-48":"magritte-avatar-focus-border-48___Bc-lN_5-0-19","avatarFocusBorder48":"magritte-avatar-focus-border-48___Bc-lN_5-0-19","avatar_with-online-badge-96":"magritte-avatar_with-online-badge-96___r4E42_5-0-19","avatarWithOnlineBadge96":"magritte-avatar_with-online-badge-96___r4E42_5-0-19","avatar-online-badge-96":"magritte-avatar-online-badge-96___d6bm-_5-0-19","avatarOnlineBadge96":"magritte-avatar-online-badge-96___d6bm-_5-0-19","avatar-focus-border-96":"magritte-avatar-focus-border-96___TVpd0_5-0-19","avatarFocusBorder96":"magritte-avatar-focus-border-96___TVpd0_5-0-19","avatar_with-online-badge-208":"magritte-avatar_with-online-badge-208___AS6Lk_5-0-19","avatarWithOnlineBadge208":"magritte-avatar_with-online-badge-208___AS6Lk_5-0-19","avatar-online-badge-208":"magritte-avatar-online-badge-208___m4hXQ_5-0-19","avatarOnlineBadge208":"magritte-avatar-online-badge-208___m4hXQ_5-0-19","avatar-focus-border-208":"magritte-avatar-focus-border-208___V6We2_5-0-19","avatarFocusBorder208":"magritte-avatar-focus-border-208___V6We2_5-0-19"};
7
-
8
- const AvatarSkeleton = ({ Component: Avatar,
9
- // skeleton props
10
- width, height, borderRadius, inline, additionalClass, loading, ...avatarProps }) => {
11
- return (jsx(Skeleton, { loading: loading, additionalClass: classnames({
12
- [styles[`avatar-skeleton-${avatarProps.size}`]]: avatarProps.size,
13
- [styles.avatarSkeletonCircle]: avatarProps.shapeCircle,
14
- }), children: jsx(Avatar, { ...avatarProps }) }));
15
- };
16
-
17
- export { AvatarSkeleton as A, styles as s };
18
- //# sourceMappingURL=Skeleton-U-xqNx9I.js.map