@hh.ru/magritte-ui-avatar 8.1.9 → 8.2.1

package/Avatar.js

@@ -3,7 +3,8 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef, useState, useRef, useLayoutEffect } from 'react';
 import classnames from 'classnames';
 import { useDisabled } from '@hh.ru/magritte-common-use-disabled';
-import { A as AvatarSkeleton, s as styles } from './Skeleton-vr-Papn9.js';
+import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
+import { A as AvatarSkeleton, s as styles } from './Skeleton-CmjxPtah.js';
 import { AVATAR_TYPOGRAPHY_MAP, formatLetters } from './utils.js';
 import { IconDynamic } from '@hh.ru/magritte-ui-icon';
 import { PlayFilledSize24, PlayFilledSize16 } from '@hh.ru/magritte-ui-icon/variants/icon';
@@ -51,6 +52,9 @@ const ACTION_ICON_SIZE_MAP = {
 const AvatarForwardRefRenderFunc = ({ mode, size = 24, 'aria-label': ariaLabel, shapeCircle = false, online = false, styleOnline = 'positive', disabled = false, letters, style, icon, image, video: _video, actionIconGlyph: ActionIcon, placeholder = 'undefined', Element = 'div', containerDataQa = '', ...avatarProps }, ref) => {
     const [imageState, setImageState] = useState('loading');
     const imageRef = useRef(null);
+    const forwardedRef = ref;
+    const elementRef = useRef(null);
+    const avatarRef = useMultipleRefs(forwardedRef, elementRef);
     const withVideo = _video && !shapeCircle && size in VIDEO_SIZE_MAP;
     const withActionIcon = !!ActionIcon && !online && size in ACTION_ICON_SIZE_MAP;
     const isActive = !!avatarProps.onClick || Element === 'a';
@@ -69,9 +73,7 @@ const AvatarForwardRefRenderFunc = ({ mode, size = 24, 'aria-label': ariaLabel,
     if (isComponentDisabled && Element === 'a') {
         additionalAttributes.tabIndex = -1;
     }
-    if (ref) {
-        additionalAttributes.ref = ref;
-    }
+    additionalAttributes.ref = avatarRef;
     if (withVideo) {
         const { Icon, padding } = VIDEO_SIZE_MAP[size];
         const colorProps = {
@@ -103,7 +105,7 @@ const AvatarForwardRefRenderFunc = ({ mode, size = 24, 'aria-label': ariaLabel,
         actionIcon = (jsxs(Fragment, { children: [jsx("span", { className: styles[`avatar-focus-border-${size}`] }), jsx("span", { className: classnames(styles.actionIcon, {
                         [styles[`action-icon-square-size-${size}`]]: !shapeCircle,
                         [styles[`action-icon-circle-size-${size}`]]: !!shapeCircle,
-                    }), "data-qa": "avatar-action", children: jsx(ActionIcon, { ...colorProps, padding: padding, borderRadius: 'halfHeight' }) })] }));
+                    }), "data-qa": "avatar-action", onClick: () => elementRef.current?.click(), children: jsx(ActionIcon, { ...colorProps, padding: padding, borderRadius: 'halfHeight' }) })] }));
     }
     const classNames = {
         [styles.avatar]: true,

package/Avatar.js.map

@@ -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 { 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 { IconDynamic } from '@hh.ru/magritte-ui-icon';\nimport { PlayFilledSize16, PlayFilledSize24 } from '@hh.ru/magritte-ui-icon/variants/icon';\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 VIDEO_SIZE_MAP = {\n    208: {\n        Icon: PlayFilledSize24,\n        padding: 8,\n    },\n    120: {\n        Icon: PlayFilledSize16,\n        padding: 8,\n    },\n    96: {\n        Icon: PlayFilledSize16,\n        padding: 8,\n    },\n    80: {\n        Icon: PlayFilledSize16,\n        padding: 6,\n    },\n} as const;\n\nconst ACTION_ICON_SIZE_MAP = {\n    208: {\n        padding: 8,\n    },\n    120: {\n        padding: 6,\n    },\n    96: {\n        padding: 6,\n    },\n    80: {\n        padding: 6,\n    },\n    48: {\n        padding: 4,\n    },\n    40: {\n        padding: 4,\n    },\n} as const;\n\nconst AvatarForwardRefRenderFunc: PolymorphicForwardRefRenderFunc<AvatarProps, 'div'> = (\n    {\n        mode,\n        size = 24,\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        video: _video,\n        actionIconGlyph: ActionIcon,\n        placeholder = 'undefined',\n        Element = 'div',\n        containerDataQa = '',\n        ...avatarProps\n    },\n    ref\n) => {\n    const [imageState, setImageState] = useState<'loading' | 'loading-animation' | 'loaded' | 'error'>('loading');\n    const imageRef = useRef<HTMLImageElement>(null);\n    const withVideo = _video && !shapeCircle && size in VIDEO_SIZE_MAP;\n    const withActionIcon = !!ActionIcon && !online && size in ACTION_ICON_SIZE_MAP;\n    const isActive = !!avatarProps.onClick || Element === 'a';\n    let video = null;\n    let actionIcon = null;\n\n    const forceDisabled = useDisabled();\n\n    const isComponentDisabled = disabled || forceDisabled;\n\n    const isModeLetters = mode === 'letters';\n    const isModeIcon = mode === 'icon';\n    const isModePlaceholder = mode === 'placeholder' || (mode === 'image' && imageState === 'error');\n    const isModeImage = mode === 'image' && imageState !== 'error';\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.tabIndex = -1;\n    }\n\n    if (ref) {\n        additionalAttributes.ref = ref;\n    }\n\n    if (withVideo) {\n        const { Icon, padding } = VIDEO_SIZE_MAP[size as keyof typeof VIDEO_SIZE_MAP];\n        const colorProps = {\n            initialColor: 'constant',\n            backgroundStyle: 'overlay',\n            ...(isActive &&\n                ({\n                    highlightedColor: 'constant',\n                    pressedColor: 'constant',\n                    hoverBackgroundStyle: 'overlay',\n                    pressedBackgroundStyle: 'overlay',\n                } as const)),\n        } as const;\n        video = (\n            <span className={styles.video} data-qa=\"avatar-video\">\n                <Icon {...colorProps} padding={padding} borderRadius={'halfHeight'} />\n            </span>\n        );\n    }\n\n    if (withActionIcon) {\n        const { padding } = ACTION_ICON_SIZE_MAP[size as keyof typeof ACTION_ICON_SIZE_MAP];\n        const colorProps = {\n            initialColor: 'constant',\n            backgroundStyle: 'accent',\n            ...(isActive &&\n                ({\n                    highlightedColor: 'constant',\n                    pressedColor: 'constant',\n                    hoverBackgroundStyle: 'accent',\n                    pressedBackgroundStyle: 'accent',\n                } as const)),\n        } as const;\n        actionIcon = (\n            <>\n                <span className={styles[`avatar-focus-border-${size}`]} />\n                <span\n                    className={classnames(styles.actionIcon, {\n                        [styles[`action-icon-square-size-${size}`]]: !shapeCircle,\n                        [styles[`action-icon-circle-size-${size}`]]: !!shapeCircle,\n                    })}\n                    data-qa=\"avatar-action\"\n                >\n                    <ActionIcon {...colorProps} padding={padding} borderRadius={'halfHeight'} />\n                </span>\n            </>\n        );\n    }\n\n    const classNames = {\n        [styles.avatar]: true,\n        [styles.avatarShapeCircle]: shapeCircle,\n        [styles.avatarModeImage]: mode === 'image' && imageState === 'loaded',\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        [styles[`avatar_with-action-icon`]]: withActionIcon,\n        [styles[`avatar_with-action-icon-${size}`]]: withActionIcon,\n    };\n\n    if ((isModeLetters || isModeIcon) && style) {\n        classNames[styles[`avatar_style-${style}`]] = !!style;\n    }\n\n    useLayoutEffect(() => {\n        const imageElement = imageRef.current;\n        if (!imageElement || !image) {\n            return void 0;\n        }\n\n        const loadingStartTime = Date.now();\n\n        const handleOnLoad = () => {\n            // если картинка грузилась дольше 300мс, анимируем прозрачность, иначе показываем без анимации\n            if (Date.now() - loadingStartTime > 300) {\n                const handleAnimationEnd = () => {\n                    imageElement.removeEventListener('animationend', handleAnimationEnd);\n                    setImageState('loaded');\n                };\n                imageElement.addEventListener('animationend', handleAnimationEnd);\n                setImageState('loading-animation');\n            } else {\n                setImageState('loaded');\n            }\n        };\n\n        const handleOnError = () => setImageState('error');\n\n        imageRef.current.addEventListener('load', handleOnLoad);\n        imageRef.current.addEventListener('error', handleOnError);\n        imageRef.current.src = image;\n        setImageState('loading');\n\n        return () => {\n            imageElement.removeEventListener('load', handleOnLoad);\n            imageElement.removeEventListener('error', handleOnError);\n        };\n    }, [image]);\n\n    return (\n        <div\n            {...(online || withVideo || !!ActionIcon || isComponentDisabled\n                ? {\n                      className: classnames({\n                          [styles.avatarContainer]: online || withVideo || !!ActionIcon,\n                          [styles.avatarContainerDisabled]: isComponentDisabled,\n                          [styles[`avatar-container_size-${size}`]]: online || withVideo || !!ActionIcon,\n                          [styles.active]: isActive,\n                      }),\n                  }\n                : {})}\n            {...(containerDataQa ? { 'data-qa': containerDataQa } : {})}\n        >\n            <IconDynamic>\n                <div>\n                    <Element\n                        {...additionalAttributes}\n                        {...avatarProps}\n                        className={classnames(classNames)}\n                        disabled={Element === 'button' ? isComponentDisabled : false}\n                        aria-disabled={isComponentDisabled}\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                            <div\n                                className={classnames({\n                                    [styles.female]: placeholder === 'female',\n                                    [styles.male]: placeholder === 'male',\n                                    [styles.city]: placeholder === 'city',\n                                    [styles.undefined]: placeholder === 'undefined',\n                                })}\n                                data-qa={`placeholder-${placeholder}`}\n                                style={{ width: size, height: size }}\n                            />\n                        )}\n                        {isModeImage && (\n                            <>\n                                {(imageState === 'loading' || imageState === 'loading-animation') && (\n                                    <div\n                                        className={classnames(styles.avatarImageLoading, {\n                                            [styles[`avatar_size-${size}`]]: size,\n                                            [styles.avatarShapeCircle]: shapeCircle,\n                                        })}\n                                    />\n                                )}\n                                <img\n                                    ref={imageRef}\n                                    alt={ariaLabel}\n                                    className={classnames(styles.avatarImage, {\n                                        [styles.avatarImageHidden]: imageState === 'loading',\n                                        [styles.avatarImageAnimation]: imageState === 'loading-animation',\n                                    })}\n                                />\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                    {actionIcon}\n                    {video}\n                </div>\n            </IconDynamic>\n        </div>\n    );\n};\n\nconst AvatarComponent = forwardRef(AvatarForwardRefRenderFunc) as PolymorphicComponentWithRef<AvatarProps, 'div'>;\n\nexport const Avatar = enrichWithSkeleton(AvatarComponent, AvatarSkeleton);\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Avatar.js","sources":["src/Avatar.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, useLayoutEffect, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport type { PolymorphicForwardRefRenderFunc, PolymorphicComponentWithRef } from '@hh.ru/magritte-types';\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 { IconDynamic } from '@hh.ru/magritte-ui-icon';\nimport { PlayFilledSize16, PlayFilledSize24 } from '@hh.ru/magritte-ui-icon/variants/icon';\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 VIDEO_SIZE_MAP = {\n    208: {\n        Icon: PlayFilledSize24,\n        padding: 8,\n    },\n    120: {\n        Icon: PlayFilledSize16,\n        padding: 8,\n    },\n    96: {\n        Icon: PlayFilledSize16,\n        padding: 8,\n    },\n    80: {\n        Icon: PlayFilledSize16,\n        padding: 6,\n    },\n} as const;\n\nconst ACTION_ICON_SIZE_MAP = {\n    208: {\n        padding: 8,\n    },\n    120: {\n        padding: 6,\n    },\n    96: {\n        padding: 6,\n    },\n    80: {\n        padding: 6,\n    },\n    48: {\n        padding: 4,\n    },\n    40: {\n        padding: 4,\n    },\n} as const;\n\nconst AvatarForwardRefRenderFunc: PolymorphicForwardRefRenderFunc<AvatarProps, 'div'> = (\n    {\n        mode,\n        size = 24,\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        video: _video,\n        actionIconGlyph: ActionIcon,\n        placeholder = 'undefined',\n        Element = 'div',\n        containerDataQa = '',\n        ...avatarProps\n    },\n    ref\n) => {\n    const [imageState, setImageState] = useState<'loading' | 'loading-animation' | 'loaded' | 'error'>('loading');\n    const imageRef = useRef<HTMLImageElement>(null);\n    const forwardedRef = ref as ForwardedRef<HTMLElement>;\n    const elementRef = useRef<HTMLElement>(null);\n    const avatarRef = useMultipleRefs(forwardedRef, elementRef);\n    const withVideo = _video && !shapeCircle && size in VIDEO_SIZE_MAP;\n    const withActionIcon = !!ActionIcon && !online && size in ACTION_ICON_SIZE_MAP;\n    const isActive = !!avatarProps.onClick || Element === 'a';\n    let video = null;\n    let actionIcon = null;\n\n    const forceDisabled = useDisabled();\n\n    const isComponentDisabled = disabled || forceDisabled;\n\n    const isModeLetters = mode === 'letters';\n    const isModeIcon = mode === 'icon';\n    const isModePlaceholder = mode === 'placeholder' || (mode === 'image' && imageState === 'error');\n    const isModeImage = mode === 'image' && imageState !== 'error';\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.tabIndex = -1;\n    }\n\n    additionalAttributes.ref = avatarRef;\n\n    if (withVideo) {\n        const { Icon, padding } = VIDEO_SIZE_MAP[size as keyof typeof VIDEO_SIZE_MAP];\n        const colorProps = {\n            initialColor: 'constant',\n            backgroundStyle: 'overlay',\n            ...(isActive &&\n                ({\n                    highlightedColor: 'constant',\n                    pressedColor: 'constant',\n                    hoverBackgroundStyle: 'overlay',\n                    pressedBackgroundStyle: 'overlay',\n                } as const)),\n        } as const;\n        video = (\n            <span className={styles.video} data-qa=\"avatar-video\">\n                <Icon {...colorProps} padding={padding} borderRadius={'halfHeight'} />\n            </span>\n        );\n    }\n\n    if (withActionIcon) {\n        const { padding } = ACTION_ICON_SIZE_MAP[size as keyof typeof ACTION_ICON_SIZE_MAP];\n        const colorProps = {\n            initialColor: 'constant',\n            backgroundStyle: 'accent',\n            ...(isActive &&\n                ({\n                    highlightedColor: 'constant',\n                    pressedColor: 'constant',\n                    hoverBackgroundStyle: 'accent',\n                    pressedBackgroundStyle: 'accent',\n                } as const)),\n        } as const;\n        actionIcon = (\n            <>\n                <span className={styles[`avatar-focus-border-${size}`]} />\n                <span\n                    className={classnames(styles.actionIcon, {\n                        [styles[`action-icon-square-size-${size}`]]: !shapeCircle,\n                        [styles[`action-icon-circle-size-${size}`]]: !!shapeCircle,\n                    })}\n                    data-qa=\"avatar-action\"\n                    onClick={() => elementRef.current?.click()}\n                >\n                    <ActionIcon {...colorProps} padding={padding} borderRadius={'halfHeight'} />\n                </span>\n            </>\n        );\n    }\n\n    const classNames = {\n        [styles.avatar]: true,\n        [styles.avatarShapeCircle]: shapeCircle,\n        [styles.avatarModeImage]: mode === 'image' && imageState === 'loaded',\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        [styles[`avatar_with-action-icon`]]: withActionIcon,\n        [styles[`avatar_with-action-icon-${size}`]]: withActionIcon,\n    };\n\n    if ((isModeLetters || isModeIcon) && style) {\n        classNames[styles[`avatar_style-${style}`]] = !!style;\n    }\n\n    useLayoutEffect(() => {\n        const imageElement = imageRef.current;\n        if (!imageElement || !image) {\n            return void 0;\n        }\n\n        const loadingStartTime = Date.now();\n\n        const handleOnLoad = () => {\n            // если картинка грузилась дольше 300мс, анимируем прозрачность, иначе показываем без анимации\n            if (Date.now() - loadingStartTime > 300) {\n                const handleAnimationEnd = () => {\n                    imageElement.removeEventListener('animationend', handleAnimationEnd);\n                    setImageState('loaded');\n                };\n                imageElement.addEventListener('animationend', handleAnimationEnd);\n                setImageState('loading-animation');\n            } else {\n                setImageState('loaded');\n            }\n        };\n\n        const handleOnError = () => setImageState('error');\n\n        imageRef.current.addEventListener('load', handleOnLoad);\n        imageRef.current.addEventListener('error', handleOnError);\n        imageRef.current.src = image;\n        setImageState('loading');\n\n        return () => {\n            imageElement.removeEventListener('load', handleOnLoad);\n            imageElement.removeEventListener('error', handleOnError);\n        };\n    }, [image]);\n\n    return (\n        <div\n            {...(online || withVideo || !!ActionIcon || isComponentDisabled\n                ? {\n                      className: classnames({\n                          [styles.avatarContainer]: online || withVideo || !!ActionIcon,\n                          [styles.avatarContainerDisabled]: isComponentDisabled,\n                          [styles[`avatar-container_size-${size}`]]: online || withVideo || !!ActionIcon,\n                          [styles.active]: isActive,\n                      }),\n                  }\n                : {})}\n            {...(containerDataQa ? { 'data-qa': containerDataQa } : {})}\n        >\n            <IconDynamic>\n                <div>\n                    <Element\n                        {...additionalAttributes}\n                        {...avatarProps}\n                        className={classnames(classNames)}\n                        disabled={Element === 'button' ? isComponentDisabled : false}\n                        aria-disabled={isComponentDisabled}\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                            <div\n                                className={classnames({\n                                    [styles.female]: placeholder === 'female',\n                                    [styles.male]: placeholder === 'male',\n                                    [styles.city]: placeholder === 'city',\n                                    [styles.undefined]: placeholder === 'undefined',\n                                })}\n                                data-qa={`placeholder-${placeholder}`}\n                                style={{ width: size, height: size }}\n                            />\n                        )}\n                        {isModeImage && (\n                            <>\n                                {(imageState === 'loading' || imageState === 'loading-animation') && (\n                                    <div\n                                        className={classnames(styles.avatarImageLoading, {\n                                            [styles[`avatar_size-${size}`]]: size,\n                                            [styles.avatarShapeCircle]: shapeCircle,\n                                        })}\n                                    />\n                                )}\n                                <img\n                                    ref={imageRef}\n                                    alt={ariaLabel}\n                                    className={classnames(styles.avatarImage, {\n                                        [styles.avatarImageHidden]: imageState === 'loading',\n                                        [styles.avatarImageAnimation]: imageState === 'loading-animation',\n                                    })}\n                                />\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                    {actionIcon}\n                    {video}\n                </div>\n            </IconDynamic>\n        </div>\n    );\n};\n\nconst AvatarComponent = forwardRef(AvatarForwardRefRenderFunc) as PolymorphicComponentWithRef<AvatarProps, 'div'>;\n\nexport const Avatar = enrichWithSkeleton(AvatarComponent, AvatarSkeleton);\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/AvatarStack.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef, Children, cloneElement } from 'react';
 import classnames from 'classnames';
 
-var styles = {"avatar-stack":"magritte-avatar-stack___5qOCC_8-1-9","avatarStack":"magritte-avatar-stack___5qOCC_8-1-9","avatar-stack-inline":"magritte-avatar-stack-inline___aXUFe_8-1-9","avatarStackInline":"magritte-avatar-stack-inline___aXUFe_8-1-9","avatar-stack-item":"magritte-avatar-stack-item___hDdq8_8-1-9","avatarStackItem":"magritte-avatar-stack-item___hDdq8_8-1-9","avatar-stack-size-16":"magritte-avatar-stack-size-16___Yuwfu_8-1-9","avatarStackSize16":"magritte-avatar-stack-size-16___Yuwfu_8-1-9","avatar-stack-circle":"magritte-avatar-stack-circle___tQZvM_8-1-9","avatarStackCircle":"magritte-avatar-stack-circle___tQZvM_8-1-9","avatar-stack-rect":"magritte-avatar-stack-rect___Ip8L2_8-1-9","avatarStackRect":"magritte-avatar-stack-rect___Ip8L2_8-1-9","avatar-stack-size-24":"magritte-avatar-stack-size-24___oZNQA_8-1-9","avatarStackSize24":"magritte-avatar-stack-size-24___oZNQA_8-1-9","avatar-stack-size-40":"magritte-avatar-stack-size-40___oBfvX_8-1-9","avatarStackSize40":"magritte-avatar-stack-size-40___oBfvX_8-1-9","avatar-stack-size-48":"magritte-avatar-stack-size-48___KGUEt_8-1-9","avatarStackSize48":"magritte-avatar-stack-size-48___KGUEt_8-1-9","avatar-stack-size-80":"magritte-avatar-stack-size-80___JnGV-_8-1-9","avatarStackSize80":"magritte-avatar-stack-size-80___JnGV-_8-1-9","avatar-stack-size-96":"magritte-avatar-stack-size-96___1LxDK_8-1-9","avatarStackSize96":"magritte-avatar-stack-size-96___1LxDK_8-1-9"};
+var styles = {"avatar-stack":"magritte-avatar-stack___5qOCC_8-2-1","avatarStack":"magritte-avatar-stack___5qOCC_8-2-1","avatar-stack-inline":"magritte-avatar-stack-inline___aXUFe_8-2-1","avatarStackInline":"magritte-avatar-stack-inline___aXUFe_8-2-1","avatar-stack-item":"magritte-avatar-stack-item___hDdq8_8-2-1","avatarStackItem":"magritte-avatar-stack-item___hDdq8_8-2-1","avatar-stack-size-16":"magritte-avatar-stack-size-16___Yuwfu_8-2-1","avatarStackSize16":"magritte-avatar-stack-size-16___Yuwfu_8-2-1","avatar-stack-circle":"magritte-avatar-stack-circle___tQZvM_8-2-1","avatarStackCircle":"magritte-avatar-stack-circle___tQZvM_8-2-1","avatar-stack-rect":"magritte-avatar-stack-rect___Ip8L2_8-2-1","avatarStackRect":"magritte-avatar-stack-rect___Ip8L2_8-2-1","avatar-stack-size-24":"magritte-avatar-stack-size-24___oZNQA_8-2-1","avatarStackSize24":"magritte-avatar-stack-size-24___oZNQA_8-2-1","avatar-stack-size-40":"magritte-avatar-stack-size-40___oBfvX_8-2-1","avatarStackSize40":"magritte-avatar-stack-size-40___oBfvX_8-2-1","avatar-stack-size-48":"magritte-avatar-stack-size-48___KGUEt_8-2-1","avatarStackSize48":"magritte-avatar-stack-size-48___KGUEt_8-2-1","avatar-stack-size-80":"magritte-avatar-stack-size-80___JnGV-_8-2-1","avatarStackSize80":"magritte-avatar-stack-size-80___JnGV-_8-2-1","avatar-stack-size-96":"magritte-avatar-stack-size-96___1LxDK_8-2-1","avatarStackSize96":"magritte-avatar-stack-size-96___1LxDK_8-2-1"};
 
 const AvatarStack = forwardRef(({ size = 24, shape = 'rectangle', inline = false, 'data-qa': dataQa = 'avatar-stack', children }, ref) => {
     return (jsx("ul", { ref: ref, className: classnames(styles.avatarStack, styles[`avatarStackSize${size}`], {

package/Skeleton-CmjxPtah.js

@@ -0,0 +1,18 @@
+import './index.css';
+import { jsx } from 'react/jsx-runtime';
+import classnames from 'classnames';
+import { Skeleton } from '@hh.ru/magritte-ui-skeleton';
+
+var styles = {"avatar-container":"magritte-avatar-container___jBkeI_8-2-1","avatarContainer":"magritte-avatar-container___jBkeI_8-2-1","active":"magritte-active___0I0gv_8-2-1","avatar-container_disabled":"magritte-avatar-container_disabled___EkG4l_8-2-1","avatarContainerDisabled":"magritte-avatar-container_disabled___EkG4l_8-2-1","avatar":"magritte-avatar___x--BK_8-2-1","avatar-container_size-16":"magritte-avatar-container_size-16___bGrZk_8-2-1","avatarContainerSize16":"magritte-avatar-container_size-16___bGrZk_8-2-1","avatar-skeleton-16":"magritte-avatar-skeleton-16___Iyj5G_8-2-1","avatarSkeleton16":"magritte-avatar-skeleton-16___Iyj5G_8-2-1","avatar_size-16":"magritte-avatar_size-16___vaXSD_8-2-1","avatarSize16":"magritte-avatar_size-16___vaXSD_8-2-1","avatar-container_size-24":"magritte-avatar-container_size-24___f6DH2_8-2-1","avatarContainerSize24":"magritte-avatar-container_size-24___f6DH2_8-2-1","avatar-skeleton-24":"magritte-avatar-skeleton-24___9hUuj_8-2-1","avatarSkeleton24":"magritte-avatar-skeleton-24___9hUuj_8-2-1","avatar_size-24":"magritte-avatar_size-24___0dAId_8-2-1","avatarSize24":"magritte-avatar_size-24___0dAId_8-2-1","avatar-container_size-40":"magritte-avatar-container_size-40___mVeBD_8-2-1","avatarContainerSize40":"magritte-avatar-container_size-40___mVeBD_8-2-1","avatar-skeleton-40":"magritte-avatar-skeleton-40___ZN6a7_8-2-1","avatarSkeleton40":"magritte-avatar-skeleton-40___ZN6a7_8-2-1","avatar_size-40":"magritte-avatar_size-40___zj3fM_8-2-1","avatarSize40":"magritte-avatar_size-40___zj3fM_8-2-1","avatar-container_size-48":"magritte-avatar-container_size-48___pflud_8-2-1","avatarContainerSize48":"magritte-avatar-container_size-48___pflud_8-2-1","avatar-skeleton-48":"magritte-avatar-skeleton-48___CC-af_8-2-1","avatarSkeleton48":"magritte-avatar-skeleton-48___CC-af_8-2-1","avatar_size-48":"magritte-avatar_size-48___JzITc_8-2-1","avatarSize48":"magritte-avatar_size-48___JzITc_8-2-1","avatar-container_size-80":"magritte-avatar-container_size-80___y8zNb_8-2-1","avatarContainerSize80":"magritte-avatar-container_size-80___y8zNb_8-2-1","avatar-skeleton-80":"magritte-avatar-skeleton-80___Z0Oc8_8-2-1","avatarSkeleton80":"magritte-avatar-skeleton-80___Z0Oc8_8-2-1","avatar_size-80":"magritte-avatar_size-80___YiSBZ_8-2-1","avatarSize80":"magritte-avatar_size-80___YiSBZ_8-2-1","avatar-container_size-96":"magritte-avatar-container_size-96___Up8Hn_8-2-1","avatarContainerSize96":"magritte-avatar-container_size-96___Up8Hn_8-2-1","avatar-skeleton-96":"magritte-avatar-skeleton-96___qYG-Z_8-2-1","avatarSkeleton96":"magritte-avatar-skeleton-96___qYG-Z_8-2-1","avatar_size-96":"magritte-avatar_size-96___5SeO2_8-2-1","avatarSize96":"magritte-avatar_size-96___5SeO2_8-2-1","avatar-container_size-120":"magritte-avatar-container_size-120___gkMBo_8-2-1","avatarContainerSize120":"magritte-avatar-container_size-120___gkMBo_8-2-1","avatar-skeleton-120":"magritte-avatar-skeleton-120___KD5Za_8-2-1","avatarSkeleton120":"magritte-avatar-skeleton-120___KD5Za_8-2-1","avatar_size-120":"magritte-avatar_size-120___th2TT_8-2-1","avatarSize120":"magritte-avatar_size-120___th2TT_8-2-1","avatar-container_size-208":"magritte-avatar-container_size-208___k7SkJ_8-2-1","avatarContainerSize208":"magritte-avatar-container_size-208___k7SkJ_8-2-1","avatar-skeleton-208":"magritte-avatar-skeleton-208___ybqJw_8-2-1","avatarSkeleton208":"magritte-avatar-skeleton-208___ybqJw_8-2-1","avatar_size-208":"magritte-avatar_size-208___rzfu3_8-2-1","avatarSize208":"magritte-avatar_size-208___rzfu3_8-2-1","avatar_shape-circle":"magritte-avatar_shape-circle___kEbru_8-2-1","avatarShapeCircle":"magritte-avatar_shape-circle___kEbru_8-2-1","avatar-skeleton-circle":"magritte-avatar-skeleton-circle___rD1E0_8-2-1","avatarSkeletonCircle":"magritte-avatar-skeleton-circle___rD1E0_8-2-1","avatar_style-color-1":"magritte-avatar_style-color-1___xXtkh_8-2-1","avatarStyleColor1":"magritte-avatar_style-color-1___xXtkh_8-2-1","avatar_style-color-2":"magritte-avatar_style-color-2___JraJd_8-2-1","avatarStyleColor2":"magritte-avatar_style-color-2___JraJd_8-2-1","avatar_style-color-3":"magritte-avatar_style-color-3___g29U3_8-2-1","avatarStyleColor3":"magritte-avatar_style-color-3___g29U3_8-2-1","avatar_style-color-4":"magritte-avatar_style-color-4___pHhmj_8-2-1","avatarStyleColor4":"magritte-avatar_style-color-4___pHhmj_8-2-1","avatar_style-color-5":"magritte-avatar_style-color-5___H9Ie3_8-2-1","avatarStyleColor5":"magritte-avatar_style-color-5___H9Ie3_8-2-1","avatar_style-color-6":"magritte-avatar_style-color-6___oODXO_8-2-1","avatarStyleColor6":"magritte-avatar_style-color-6___oODXO_8-2-1","avatar_style-color-7":"magritte-avatar_style-color-7___SfUBl_8-2-1","avatarStyleColor7":"magritte-avatar_style-color-7___SfUBl_8-2-1","avatar_style-color-8":"magritte-avatar_style-color-8___rlI6h_8-2-1","avatarStyleColor8":"magritte-avatar_style-color-8___rlI6h_8-2-1","avatar_style-color-9":"magritte-avatar_style-color-9___XQO4B_8-2-1","avatarStyleColor9":"magritte-avatar_style-color-9___XQO4B_8-2-1","avatar_style-primary":"magritte-avatar_style-primary___SvqU1_8-2-1","avatarStylePrimary":"magritte-avatar_style-primary___SvqU1_8-2-1","avatar_style-secondary":"magritte-avatar_style-secondary___C6MTH_8-2-1","avatarStyleSecondary":"magritte-avatar_style-secondary___C6MTH_8-2-1","avatar_style-tertiary":"magritte-avatar_style-tertiary___3o-90_8-2-1","avatarStyleTertiary":"magritte-avatar_style-tertiary___3o-90_8-2-1","avatar_style-accent-secondary":"magritte-avatar_style-accent-secondary___vc7Lb_8-2-1","avatarStyleAccentSecondary":"magritte-avatar_style-accent-secondary___vc7Lb_8-2-1","avatar_style-accent":"magritte-avatar_style-accent___LgPSo_8-2-1","avatarStyleAccent":"magritte-avatar_style-accent___LgPSo_8-2-1","avatar_style-positive-secondary":"magritte-avatar_style-positive-secondary___aQrkm_8-2-1","avatarStylePositiveSecondary":"magritte-avatar_style-positive-secondary___aQrkm_8-2-1","avatar_style-positive":"magritte-avatar_style-positive___bDzbE_8-2-1","avatarStylePositive":"magritte-avatar_style-positive___bDzbE_8-2-1","avatar_style-negative-secondary":"magritte-avatar_style-negative-secondary___GW7rc_8-2-1","avatarStyleNegativeSecondary":"magritte-avatar_style-negative-secondary___GW7rc_8-2-1","avatar_style-negative":"magritte-avatar_style-negative___xHHQb_8-2-1","avatarStyleNegative":"magritte-avatar_style-negative___xHHQb_8-2-1","avatar_style-warning-secondary":"magritte-avatar_style-warning-secondary___LKwiW_8-2-1","avatarStyleWarningSecondary":"magritte-avatar_style-warning-secondary___LKwiW_8-2-1","avatar_style-warning":"magritte-avatar_style-warning___7kKRS_8-2-1","avatarStyleWarning":"magritte-avatar_style-warning___7kKRS_8-2-1","avatar_style-special-secondary":"magritte-avatar_style-special-secondary___J2CwS_8-2-1","avatarStyleSpecialSecondary":"magritte-avatar_style-special-secondary___J2CwS_8-2-1","avatar_style-special":"magritte-avatar_style-special___gLmS0_8-2-1","avatarStyleSpecial":"magritte-avatar_style-special___gLmS0_8-2-1","avatar_style-dreamy-secondary":"magritte-avatar_style-dreamy-secondary___WoWcK_8-2-1","avatarStyleDreamySecondary":"magritte-avatar_style-dreamy-secondary___WoWcK_8-2-1","avatar_style-dreamy":"magritte-avatar_style-dreamy___-zjx5_8-2-1","avatarStyleDreamy":"magritte-avatar_style-dreamy___-zjx5_8-2-1","avatar_style-lovely-secondary":"magritte-avatar_style-lovely-secondary___YhzZk_8-2-1","avatarStyleLovelySecondary":"magritte-avatar_style-lovely-secondary___YhzZk_8-2-1","avatar_style-lovely":"magritte-avatar_style-lovely___wy3Zg_8-2-1","avatarStyleLovely":"magritte-avatar_style-lovely___wy3Zg_8-2-1","avatar_style-vivid-secondary":"magritte-avatar_style-vivid-secondary___EcBn1_8-2-1","avatarStyleVividSecondary":"magritte-avatar_style-vivid-secondary___EcBn1_8-2-1","avatar_style-vivid":"magritte-avatar_style-vivid___pkKc5_8-2-1","avatarStyleVivid":"magritte-avatar_style-vivid___pkKc5_8-2-1","avatar_style-body":"magritte-avatar_style-body___xmokY_8-2-1","avatarStyleBody":"magritte-avatar_style-body___xmokY_8-2-1","avatar_style-overlay":"magritte-avatar_style-overlay___0yWkS_8-2-1","avatarStyleOverlay":"magritte-avatar_style-overlay___0yWkS_8-2-1","avatar_style-overlay-action":"magritte-avatar_style-overlay-action___MMxS7_8-2-1","avatarStyleOverlayAction":"magritte-avatar_style-overlay-action___MMxS7_8-2-1","avatar_style-overlay-viewer":"magritte-avatar_style-overlay-viewer___4gNO7_8-2-1","avatarStyleOverlayViewer":"magritte-avatar_style-overlay-viewer___4gNO7_8-2-1","avatar_style-overlay-toolbar":"magritte-avatar_style-overlay-toolbar___0Lvuf_8-2-1","avatarStyleOverlayToolbar":"magritte-avatar_style-overlay-toolbar___0Lvuf_8-2-1","avatar_style-transparent":"magritte-avatar_style-transparent___KtjP8_8-2-1","avatarStyleTransparent":"magritte-avatar_style-transparent___KtjP8_8-2-1","avatar_style-constant":"magritte-avatar_style-constant___HVes8_8-2-1","avatarStyleConstant":"magritte-avatar_style-constant___HVes8_8-2-1","avatar_style-constant-secondary":"magritte-avatar_style-constant-secondary___tfuOw_8-2-1","avatarStyleConstantSecondary":"magritte-avatar_style-constant-secondary___tfuOw_8-2-1","avatar_style-inverse":"magritte-avatar_style-inverse___yupyU_8-2-1","avatarStyleInverse":"magritte-avatar_style-inverse___yupyU_8-2-1","avatar_style-inverse-secondary":"magritte-avatar_style-inverse-secondary___NdawN_8-2-1","avatarStyleInverseSecondary":"magritte-avatar_style-inverse-secondary___NdawN_8-2-1","avatar_mode-image":"magritte-avatar_mode-image___02zr1_8-2-1","avatarModeImage":"magritte-avatar_mode-image___02zr1_8-2-1","avatar_mode-letters":"magritte-avatar_mode-letters___ot4qB_8-2-1","avatarModeLetters":"magritte-avatar_mode-letters___ot4qB_8-2-1","avatar_mode-icon":"magritte-avatar_mode-icon___MYrlv_8-2-1","avatarModeIcon":"magritte-avatar_mode-icon___MYrlv_8-2-1","avatar_mode-placeholder":"magritte-avatar_mode-placeholder___6hOu7_8-2-1","avatarModePlaceholder":"magritte-avatar_mode-placeholder___6hOu7_8-2-1","avatar-image":"magritte-avatar-image___05p9Z_8-2-1","avatarImage":"magritte-avatar-image___05p9Z_8-2-1","avatar-image-hidden":"magritte-avatar-image-hidden___YNZ3i_8-2-1","avatarImageHidden":"magritte-avatar-image-hidden___YNZ3i_8-2-1","avatar-image-loading":"magritte-avatar-image-loading___0QWL4_8-2-1","avatarImageLoading":"magritte-avatar-image-loading___0QWL4_8-2-1","avatar-image-animation":"magritte-avatar-image-animation___Ik79H_8-2-1","avatarImageAnimation":"magritte-avatar-image-animation___Ik79H_8-2-1","image-animation":"magritte-image-animation___6Q4Qv_8-2-1","imageAnimation":"magritte-image-animation___6Q4Qv_8-2-1","avatar_with-online-badge-16":"magritte-avatar_with-online-badge-16___rhXhS_8-2-1","avatarWithOnlineBadge16":"magritte-avatar_with-online-badge-16___rhXhS_8-2-1","avatar-online-badge-16":"magritte-avatar-online-badge-16___Xtv3l_8-2-1","avatarOnlineBadge16":"magritte-avatar-online-badge-16___Xtv3l_8-2-1","avatar-online-badge_style_positive":"magritte-avatar-online-badge_style_positive___jHyv3_8-2-1","avatarOnlineBadgeStylePositive":"magritte-avatar-online-badge_style_positive___jHyv3_8-2-1","avatar-online-badge_style_constant":"magritte-avatar-online-badge_style_constant___-TeoG_8-2-1","avatarOnlineBadgeStyleConstant":"magritte-avatar-online-badge_style_constant___-TeoG_8-2-1","avatar-focus-border-16":"magritte-avatar-focus-border-16___dnSiS_8-2-1","avatarFocusBorder16":"magritte-avatar-focus-border-16___dnSiS_8-2-1","avatar_with-online-badge-24":"magritte-avatar_with-online-badge-24___helkM_8-2-1","avatarWithOnlineBadge24":"magritte-avatar_with-online-badge-24___helkM_8-2-1","avatar-online-badge-24":"magritte-avatar-online-badge-24___mjPKB_8-2-1","avatarOnlineBadge24":"magritte-avatar-online-badge-24___mjPKB_8-2-1","avatar-focus-border-24":"magritte-avatar-focus-border-24___wnJnb_8-2-1","avatarFocusBorder24":"magritte-avatar-focus-border-24___wnJnb_8-2-1","avatar_with-online-badge-40":"magritte-avatar_with-online-badge-40___Tckho_8-2-1","avatarWithOnlineBadge40":"magritte-avatar_with-online-badge-40___Tckho_8-2-1","avatar-online-badge-40":"magritte-avatar-online-badge-40___HRNTS_8-2-1","avatarOnlineBadge40":"magritte-avatar-online-badge-40___HRNTS_8-2-1","avatar-focus-border-40":"magritte-avatar-focus-border-40___Qn9NL_8-2-1","avatarFocusBorder40":"magritte-avatar-focus-border-40___Qn9NL_8-2-1","avatar_with-online-badge-48":"magritte-avatar_with-online-badge-48___BmWaC_8-2-1","avatarWithOnlineBadge48":"magritte-avatar_with-online-badge-48___BmWaC_8-2-1","avatar-online-badge-48":"magritte-avatar-online-badge-48___qPmD8_8-2-1","avatarOnlineBadge48":"magritte-avatar-online-badge-48___qPmD8_8-2-1","avatar-focus-border-48":"magritte-avatar-focus-border-48___Bc-lN_8-2-1","avatarFocusBorder48":"magritte-avatar-focus-border-48___Bc-lN_8-2-1","avatar_with-online-badge-80":"magritte-avatar_with-online-badge-80___jvmKS_8-2-1","avatarWithOnlineBadge80":"magritte-avatar_with-online-badge-80___jvmKS_8-2-1","avatar-online-badge-80":"magritte-avatar-online-badge-80___zA5Rd_8-2-1","avatarOnlineBadge80":"magritte-avatar-online-badge-80___zA5Rd_8-2-1","avatar-focus-border-80":"magritte-avatar-focus-border-80___1X1Aa_8-2-1","avatarFocusBorder80":"magritte-avatar-focus-border-80___1X1Aa_8-2-1","avatar_with-online-badge-96":"magritte-avatar_with-online-badge-96___r4E42_8-2-1","avatarWithOnlineBadge96":"magritte-avatar_with-online-badge-96___r4E42_8-2-1","avatar-online-badge-96":"magritte-avatar-online-badge-96___d6bm-_8-2-1","avatarOnlineBadge96":"magritte-avatar-online-badge-96___d6bm-_8-2-1","avatar-focus-border-96":"magritte-avatar-focus-border-96___TVpd0_8-2-1","avatarFocusBorder96":"magritte-avatar-focus-border-96___TVpd0_8-2-1","avatar_with-online-badge-120":"magritte-avatar_with-online-badge-120___oqIED_8-2-1","avatarWithOnlineBadge120":"magritte-avatar_with-online-badge-120___oqIED_8-2-1","avatar-online-badge-120":"magritte-avatar-online-badge-120___nmWqZ_8-2-1","avatarOnlineBadge120":"magritte-avatar-online-badge-120___nmWqZ_8-2-1","avatar-focus-border-120":"magritte-avatar-focus-border-120___vHWE1_8-2-1","avatarFocusBorder120":"magritte-avatar-focus-border-120___vHWE1_8-2-1","avatar_with-online-badge-208":"magritte-avatar_with-online-badge-208___AS6Lk_8-2-1","avatarWithOnlineBadge208":"magritte-avatar_with-online-badge-208___AS6Lk_8-2-1","avatar-online-badge-208":"magritte-avatar-online-badge-208___m4hXQ_8-2-1","avatarOnlineBadge208":"magritte-avatar-online-badge-208___m4hXQ_8-2-1","avatar-focus-border-208":"magritte-avatar-focus-border-208___V6We2_8-2-1","avatarFocusBorder208":"magritte-avatar-focus-border-208___V6We2_8-2-1","female":"magritte-female___fSeyG_8-2-1","male":"magritte-male___HlZ30_8-2-1","city":"magritte-city___jNvGf_8-2-1","undefined":"magritte-undefined___E7573_8-2-1","video":"magritte-video___iTluu_8-2-1","action-icon":"magritte-action-icon___OmVxy_8-2-1","actionIcon":"magritte-action-icon___OmVxy_8-2-1","action-icon-square-size-40":"magritte-action-icon-square-size-40___1L3Xo_8-2-1","actionIconSquareSize40":"magritte-action-icon-square-size-40___1L3Xo_8-2-1","action-icon-circle-size-40":"magritte-action-icon-circle-size-40___C7KMx_8-2-1","actionIconCircleSize40":"magritte-action-icon-circle-size-40___C7KMx_8-2-1","avatar_with-action-icon-40":"magritte-avatar_with-action-icon-40___1JcwX_8-2-1","avatarWithActionIcon40":"magritte-avatar_with-action-icon-40___1JcwX_8-2-1","avatar_with-action-icon":"magritte-avatar_with-action-icon___nbOyf_8-2-1","avatarWithActionIcon":"magritte-avatar_with-action-icon___nbOyf_8-2-1","action-icon-square-size-48":"magritte-action-icon-square-size-48___wswAd_8-2-1","actionIconSquareSize48":"magritte-action-icon-square-size-48___wswAd_8-2-1","action-icon-circle-size-48":"magritte-action-icon-circle-size-48___-SgvW_8-2-1","actionIconCircleSize48":"magritte-action-icon-circle-size-48___-SgvW_8-2-1","avatar_with-action-icon-48":"magritte-avatar_with-action-icon-48___xEhfn_8-2-1","avatarWithActionIcon48":"magritte-avatar_with-action-icon-48___xEhfn_8-2-1","action-icon-square-size-80":"magritte-action-icon-square-size-80___idlrL_8-2-1","actionIconSquareSize80":"magritte-action-icon-square-size-80___idlrL_8-2-1","action-icon-circle-size-80":"magritte-action-icon-circle-size-80___M0m5S_8-2-1","actionIconCircleSize80":"magritte-action-icon-circle-size-80___M0m5S_8-2-1","avatar_with-action-icon-80":"magritte-avatar_with-action-icon-80___WHQsY_8-2-1","avatarWithActionIcon80":"magritte-avatar_with-action-icon-80___WHQsY_8-2-1","action-icon-square-size-96":"magritte-action-icon-square-size-96___-Tqc9_8-2-1","actionIconSquareSize96":"magritte-action-icon-square-size-96___-Tqc9_8-2-1","action-icon-circle-size-96":"magritte-action-icon-circle-size-96___PLdBQ_8-2-1","actionIconCircleSize96":"magritte-action-icon-circle-size-96___PLdBQ_8-2-1","avatar_with-action-icon-96":"magritte-avatar_with-action-icon-96___eiDmD_8-2-1","avatarWithActionIcon96":"magritte-avatar_with-action-icon-96___eiDmD_8-2-1","action-icon-square-size-120":"magritte-action-icon-square-size-120___7Cbax_8-2-1","actionIconSquareSize120":"magritte-action-icon-square-size-120___7Cbax_8-2-1","action-icon-circle-size-120":"magritte-action-icon-circle-size-120___HeE1a_8-2-1","actionIconCircleSize120":"magritte-action-icon-circle-size-120___HeE1a_8-2-1","avatar_with-action-icon-120":"magritte-avatar_with-action-icon-120___PHU4U_8-2-1","avatarWithActionIcon120":"magritte-avatar_with-action-icon-120___PHU4U_8-2-1","action-icon-square-size-208":"magritte-action-icon-square-size-208___3CuMs_8-2-1","actionIconSquareSize208":"magritte-action-icon-square-size-208___3CuMs_8-2-1","action-icon-circle-size-208":"magritte-action-icon-circle-size-208___0Ucxp_8-2-1","actionIconCircleSize208":"magritte-action-icon-circle-size-208___0Ucxp_8-2-1","avatar_with-action-icon-208":"magritte-avatar_with-action-icon-208___38YVJ_8-2-1","avatarWithActionIcon208":"magritte-avatar_with-action-icon-208___38YVJ_8-2-1"};
+
+const AvatarSkeleton = ({ Component: Avatar, 
+// skeleton props
+width, height, borderRadius, inline, additionalClass, loading, ...avatarProps }) => {
+    return (jsx(Skeleton, { loading: loading, additionalClass: classnames({
+            [styles[`avatar-skeleton-${avatarProps.size}`]]: avatarProps.size,
+            [styles.avatarSkeletonCircle]: avatarProps.shapeCircle,
+        }), children: jsx(Avatar, { ...avatarProps }) }));
+};
+
+export { AvatarSkeleton as A, styles as s };
+//# sourceMappingURL=Skeleton-CmjxPtah.js.map

package/{Skeleton-vr-Papn9.js.map → Skeleton-CmjxPtah.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Skeleton-vr-Papn9.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;;;;"}
+{"version":3,"file":"Skeleton-CmjxPtah.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

@@ -2,5 +2,5 @@ import './index.css';
 import 'react/jsx-runtime';
 import 'classnames';
 import '@hh.ru/magritte-ui-skeleton';
-export { A as AvatarSkeleton } from './Skeleton-vr-Papn9.js';
+export { A as AvatarSkeleton } from './Skeleton-CmjxPtah.js';
 //# sourceMappingURL=Skeleton.js.map