@salutejs/plasma-new-hope 0.238.1-canary.1692.12540362812.0 → 0.239.0-canary.1696.12710467472.0

package/cjs/components/Avatar/Avatar.js

@@ -11,11 +11,12 @@ var Avatar_tokens = require('./Avatar.tokens.js');
 var Avatar_styles = require('./Avatar.styles.js');
 var base = require('./variations/_size/base.js');
 var base$1 = require('./variations/_focused/base.js');
+var index$1 = require('./utils/index.js');
 var getInitialsForName = require('./utils/getInitialsForName.js');
 var common = require('../../engines/common.js');
 var Indicator$1 = require('../Indicator/Indicator.js');
 
-var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels"];
+var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels", "hasExtra", "extraPlacement", "type", "counterView", "count", "maxCount", "badgeView", "text", "customColor", "customBackgroundColor", "contentLeft", "contentRight", "pilled"];
 var StatusLabelsDefault = {
   active: 'Активен',
   inactive: 'Неактивен'
@@ -82,6 +83,19 @@ var avatarRoot = function avatarRoot(Root) {
       isScalable = props.isScalable,
       _props$statusLabels = props.statusLabels,
       statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
+      hasExtra = props.hasExtra,
+      extraPlacement = props.extraPlacement,
+      type = props.type,
+      counterView = props.counterView,
+      count = props.count,
+      maxCount = props.maxCount,
+      badgeView = props.badgeView,
+      text = props.text,
+      customColor = props.customColor,
+      customBackgroundColor = props.customBackgroundColor,
+      contentLeft = props.contentLeft,
+      contentRight = props.contentRight,
+      pilled = props.pilled,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
     var initials = React.useMemo(function () {
       return getInitialsForName.getInitialsForName(name);
@@ -89,13 +103,18 @@ var avatarRoot = function avatarRoot(Root) {
     var ariaLabel = getAriaLabel(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, props), {}, {
       statusLabels: statusLabels
     }));
+    var extraViewProp = type === 'badge' ? {
+      badgeView: badgeView
+    } : {
+      counterView: counterView
+    };
     return /*#__PURE__*/React.createElement(Root, _rollupPluginBabelHelpers.extends({
       ref: ref,
       size: avatarSize,
       className: index.cx(Avatar_tokens.classes.avatarItem, className),
       "aria-label": ariaLabel,
       focused: focused
-    }, rest), /*#__PURE__*/React.createElement(Avatar_styles.Wrapper, {
+    }, extraViewProp, rest), /*#__PURE__*/React.createElement(Avatar_styles.Wrapper, {
       isScalable: isScalable
     }, getAvatarContent({
       customText: customText,
@@ -105,7 +124,24 @@ var avatarRoot = function avatarRoot(Root) {
     })), status && /*#__PURE__*/React.createElement(Avatar_styles.StatusIcon, null, /*#__PURE__*/React.createElement(StyledIndicator, {
       "aria-label": statusLabels[status],
       status: status
-    })));
+    })), hasExtra && avatarSize !== 'fit' && /*#__PURE__*/React.createElement(Avatar_styles.ExtraContent, {
+      className: index$1.extraPlacementMap(extraPlacement)
+    }, type === 'counter' ? /*#__PURE__*/React.createElement(Avatar_styles.ExtraCounter, {
+      view: counterView,
+      count: count || 1,
+      maxCount: maxCount
+    }) : avatarSize !== 's' && /*#__PURE__*/React.createElement(Avatar_styles.ExtraBadge, _rollupPluginBabelHelpers.extends({
+      view: badgeView,
+      text: text,
+      customColor: customColor,
+      customBackgroundColor: customBackgroundColor,
+      pilled: pilled,
+      maxWidth: "100%"
+    }, contentLeft ? {
+      contentLeft: contentLeft
+    } : {
+      contentRight: contentRight
+    }))));
   });
 };
 var avatarConfig = {

package/cjs/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, ReactElement } from 'react';\nimport { styled } from '@linaria/react';\n\nimport { RootProps, component, mergeConfig } from '../../engines';\nimport { cx } from '../../utils';\nimport { indicatorConfig, indicatorTokens } from '../Indicator';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { base, Wrapper, Image, StatusIcon, Text } from './Avatar.styles';\nimport { base as viewCSS } from './variations/_size/base';\nimport { base as focusedCSS } from './variations/_focused/base';\nimport { getInitialsForName } from './utils';\nimport type { AvatarProps, StatusLabels } from './Avatar.types';\n\nconst StatusLabelsDefault: StatusLabels = {\n    active: 'Активен',\n    inactive: 'Неактивен',\n};\n\nconst getAvatarContent = ({\n    customText,\n    url,\n    initials,\n    name,\n}: Omit<AvatarProps, 'size'> & { initials?: string }): ReactElement => {\n    if (customText) {\n        return <Text>{customText}</Text>;\n    }\n\n    if (url) {\n        return <Image src={url} alt={name} />;\n    }\n\n    return <Text>{initials}</Text>;\n};\n\nconst getAriaLabel = ({\n    url,\n    name,\n    status,\n    'aria-label': ariaLabelProp,\n    statusLabels,\n}: Pick<AvatarProps, 'url' | 'status' | 'name' | 'aria-label'> & {\n    statusLabels: StatusLabels;\n}) => {\n    if (!url) {\n        return;\n    }\n\n    // INFO: включаем aria-label чтобы озвучить что на изображении\n    const ariaLabel = !ariaLabelProp || ariaLabelProp.trim() === '' ? name : ariaLabelProp;\n\n    return status ? `${ariaLabel}. ${statusLabels[status]}` : ariaLabel;\n};\n\nconst mergedConfig = mergeConfig(indicatorConfig);\n\nconst Indicator: React.FunctionComponent<\n    React.HTMLAttributes<HTMLDivElement> & { status: AvatarProps['status'] }\n> = component(mergedConfig) as never;\n\nconst StyledIndicator = styled(Indicator)`\n    ${indicatorTokens.size}: var(${tokens.statusIconSize});\n    ${indicatorTokens.color}: ${({ status }) =>\n    status === 'active' ? `var(${tokens.statusOnlineColor})` : `var(${tokens.statusOfflineColor})`}\n`;\n\nexport const avatarRoot = (Root: RootProps<HTMLDivElement, AvatarProps>) => {\n    return forwardRef<HTMLDivElement, AvatarProps>((props, ref) => {\n        const {\n            size: avatarSize,\n            name,\n            url,\n            customText,\n            status,\n            className,\n            focused = true,\n            isScalable,\n            statusLabels = StatusLabelsDefault,\n            ...rest\n        } = props;\n\n        const initials = useMemo(() => getInitialsForName(name), [name]);\n        const ariaLabel = getAriaLabel({\n            ...props,\n            statusLabels,\n        });\n\n        return (\n            <Root\n                ref={ref}\n                size={avatarSize}\n                className={cx(classes.avatarItem, className)}\n                aria-label={ariaLabel}\n                focused={focused}\n                {...rest}\n            >\n                <Wrapper isScalable={isScalable}>{getAvatarContent({ customText, url, initials, name })}</Wrapper>\n\n                {status && (\n                    <StatusIcon>\n                        <StyledIndicator aria-label={statusLabels[status]} status={status} />\n                    </StatusIcon>\n                )}\n            </Root>\n        );\n    });\n};\n\nexport const avatarConfig = {\n    name: 'Avatar',\n    tag: 'div',\n    layout: avatarRoot,\n    base,\n    variations: {\n        size: {\n            css: viewCSS,\n        },\n        focused: {\n            css: focusedCSS,\n        },\n    },\n    defaults: {\n        size: 'm',\n    },\n};\n"],"names":["StatusLabelsDefault","active","inactive","getAvatarContent","_ref","customText","url","initials","name","React","createElement","Text","Image","src","alt","getAriaLabel","_ref2","status","ariaLabelProp","statusLabels","ariaLabel","trim","concat","mergedConfig","mergeConfig","indicatorConfig","Indicator","component","_exp","_exp5","_ref3","tokens","statusOnlineColor","statusOfflineColor","StyledIndicator","styled","class","propsAsIs","vars","avatarRoot","Root","forwardRef","props","ref","avatarSize","size","className","_props$focused","focused","isScalable","_props$statusLabels","rest","_excluded","useMemo","getInitialsForName","_objectSpread","_extends","cx","classes","avatarItem","Wrapper","StatusIcon","avatarConfig","tag","layout","base","variations","css","viewCSS","focusedCSS","defaults"],"mappings":"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"}
+{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, ReactElement } from 'react';\nimport { styled } from '@linaria/react';\n\nimport { RootProps, component, mergeConfig } from '../../engines';\nimport { cx } from '../../utils';\nimport { indicatorConfig, indicatorTokens } from '../Indicator';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { base, Wrapper, Image, StatusIcon, Text, ExtraContent, ExtraCounter, ExtraBadge } from './Avatar.styles';\nimport { base as viewCSS } from './variations/_size/base';\nimport { base as focusedCSS } from './variations/_focused/base';\nimport { extraPlacementMap, getInitialsForName } from './utils';\nimport type { AvatarProps, StatusLabels } from './Avatar.types';\n\nconst StatusLabelsDefault: StatusLabels = {\n    active: 'Активен',\n    inactive: 'Неактивен',\n};\n\nconst getAvatarContent = ({\n    customText,\n    url,\n    initials,\n    name,\n}: Omit<AvatarProps, 'size'> & { initials?: string }): ReactElement => {\n    if (customText) {\n        return <Text>{customText}</Text>;\n    }\n\n    if (url) {\n        return <Image src={url} alt={name} />;\n    }\n\n    return <Text>{initials}</Text>;\n};\n\nconst getAriaLabel = ({\n    url,\n    name,\n    status,\n    'aria-label': ariaLabelProp,\n    statusLabels,\n}: Pick<AvatarProps, 'url' | 'status' | 'name' | 'aria-label'> & {\n    statusLabels: StatusLabels;\n}) => {\n    if (!url) {\n        return;\n    }\n\n    // INFO: включаем aria-label чтобы озвучить что на изображении\n    const ariaLabel = !ariaLabelProp || ariaLabelProp.trim() === '' ? name : ariaLabelProp;\n\n    return status ? `${ariaLabel}. ${statusLabels[status]}` : ariaLabel;\n};\n\nconst mergedConfig = mergeConfig(indicatorConfig);\n\nconst Indicator: React.FunctionComponent<\n    React.HTMLAttributes<HTMLDivElement> & { status: AvatarProps['status'] }\n> = component(mergedConfig) as never;\n\nconst StyledIndicator = styled(Indicator)`\n    ${indicatorTokens.size}: var(${tokens.statusIconSize});\n    ${indicatorTokens.color}: ${({ status }) =>\n    status === 'active' ? `var(${tokens.statusOnlineColor})` : `var(${tokens.statusOfflineColor})`}\n`;\n\nexport const avatarRoot = (Root: RootProps<HTMLDivElement, AvatarProps>) => {\n    return forwardRef<HTMLDivElement, AvatarProps>((props, ref) => {\n        const {\n            size: avatarSize,\n            name,\n            url,\n            customText,\n            status,\n            className,\n            focused = true,\n            isScalable,\n            statusLabels = StatusLabelsDefault,\n            hasExtra,\n            extraPlacement,\n\n            type,\n\n            counterView,\n            count,\n            maxCount,\n\n            badgeView,\n            text,\n            customColor,\n            customBackgroundColor,\n            contentLeft,\n            contentRight,\n            pilled,\n\n            ...rest\n        } = props;\n\n        const initials = useMemo(() => getInitialsForName(name), [name]);\n        const ariaLabel = getAriaLabel({\n            ...props,\n            statusLabels,\n        });\n\n        const extraViewProp = type === 'badge' ? { badgeView } : { counterView };\n\n        return (\n            <Root\n                ref={ref}\n                size={avatarSize}\n                className={cx(classes.avatarItem, className)}\n                aria-label={ariaLabel}\n                focused={focused}\n                {...extraViewProp}\n                {...rest}\n            >\n                <Wrapper isScalable={isScalable}>{getAvatarContent({ customText, url, initials, name })}</Wrapper>\n\n                {status && (\n                    <StatusIcon>\n                        <StyledIndicator aria-label={statusLabels[status]} status={status} />\n                    </StatusIcon>\n                )}\n\n                {hasExtra && avatarSize !== 'fit' && (\n                    <ExtraContent className={extraPlacementMap(extraPlacement)}>\n                        {type === 'counter' ? (\n                            <ExtraCounter view={counterView} count={count || 1} maxCount={maxCount} />\n                        ) : (\n                            avatarSize !== 's' && (\n                                <ExtraBadge\n                                    view={badgeView}\n                                    text={text}\n                                    customColor={customColor}\n                                    customBackgroundColor={customBackgroundColor}\n                                    pilled={pilled}\n                                    maxWidth=\"100%\"\n                                    {...(contentLeft ? { contentLeft } : { contentRight })}\n                                />\n                            )\n                        )}\n                    </ExtraContent>\n                )}\n            </Root>\n        );\n    });\n};\n\nexport const avatarConfig = {\n    name: 'Avatar',\n    tag: 'div',\n    layout: avatarRoot,\n    base,\n    variations: {\n        size: {\n            css: viewCSS,\n        },\n        focused: {\n            css: focusedCSS,\n        },\n    },\n    defaults: {\n        size: 'm',\n    },\n};\n"],"names":["StatusLabelsDefault","active","inactive","getAvatarContent","_ref","customText","url","initials","name","React","createElement","Text","Image","src","alt","getAriaLabel","_ref2","status","ariaLabelProp","statusLabels","ariaLabel","trim","concat","mergedConfig","mergeConfig","indicatorConfig","Indicator","component","_exp","_exp5","_ref3","tokens","statusOnlineColor","statusOfflineColor","StyledIndicator","styled","class","propsAsIs","vars","avatarRoot","Root","forwardRef","props","ref","avatarSize","size","className","_props$focused","focused","isScalable","_props$statusLabels","hasExtra","extraPlacement","type","counterView","count","maxCount","badgeView","text","customColor","customBackgroundColor","contentLeft","contentRight","pilled","rest","_excluded","useMemo","getInitialsForName","_objectSpread","extraViewProp","_extends","cx","classes","avatarItem","Wrapper","StatusIcon","ExtraContent","extraPlacementMap","ExtraCounter","view","ExtraBadge","maxWidth","avatarConfig","tag","layout","base","variations","css","viewCSS","focusedCSS","defaults"],"mappings":"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"}

package/cjs/components/Avatar/Avatar.styles.js

@@ -1,11 +1,18 @@
-import './Avatar.styles_1gd252x.css';
+import './Avatar.styles_131qvfx.css';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var react = require('@linaria/react');
 var Avatar_tokens = require('./Avatar.tokens.js');
+var common = require('../../engines/common.js');
+var Badge$1 = require('../Badge/Badge.js');
+var Counter$1 = require('../Counter/Counter.js');
 
+var mergedBadgeConfig = /*#__PURE__*/common.mergeConfig(Badge$1.badgeConfig);
+var Badge = /*#__PURE__*/common.component(mergedBadgeConfig);
+var mergedCounterConfig = /*#__PURE__*/common.mergeConfig(Counter$1.counterConfig);
+var Counter = /*#__PURE__*/common.component(mergedCounterConfig);
 var base = "b1d1rtx8";
 var _exp2 = function _exp2() {
   return function (_ref) {
@@ -43,7 +50,31 @@ var Text = /*#__PURE__*/react.styled('span')({
   "class": "t1kfsxcq",
   propsAsIs: false
 });
+var ExtraContent = /*#__PURE__*/react.styled('div')({
+  name: "ExtraContent",
+  "class": "e1i3umn2",
+  propsAsIs: false
+});
+var _exp26 = function _exp26() {
+  return Badge;
+};
+var ExtraBadge = /*#__PURE__*/react.styled(_exp26())({
+  name: "ExtraBadge",
+  "class": "eqy70yy",
+  propsAsIs: true
+});
+var _exp69 = function _exp69() {
+  return Counter;
+};
+var ExtraCounter = /*#__PURE__*/react.styled(_exp69())({
+  name: "ExtraCounter",
+  "class": "e4nvvok",
+  propsAsIs: true
+});
 
+exports.ExtraBadge = ExtraBadge;
+exports.ExtraContent = ExtraContent;
+exports.ExtraCounter = ExtraCounter;
 exports.Image = Image;
 exports.StatusIcon = StatusIcon;
 exports.Text = Text;

package/cjs/components/Avatar/Avatar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.styles.js","sources":["../../../src/components/Avatar/Avatar.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { tokens } from './Avatar.tokens';\nimport { AvatarProps } from './Avatar.types';\n\nexport const base = css`\n    position: relative;\n`;\n\nexport const Wrapper = styled.div<{ isScalable?: AvatarProps['isScalable'] }>`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    background: var(${tokens.backgroundColor});\n    overflow: hidden;\n\n    &:hover {\n        scale: ${({ isScalable }) => (isScalable ? `var(${tokens.scaleHover})` : '1')};\n        cursor: ${({ isScalable }) => (isScalable ? 'pointer' : 'inherit')};\n    }\n`;\n\nexport const StatusIcon = styled.div`\n    position: absolute;\n    top: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n    left: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n`;\n\nexport const Image = styled.img`\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n`;\n\nexport const Text = styled.span`\n    font-size: var(${tokens.fontSize});\n    font-family: var(${tokens.fontFamily});\n    font-weight: var(${tokens.fontWeight});\n    line-height: var(${tokens.lineHeight});\n    background-image: var(${tokens.color});\n    background-color: var(${tokens.color});\n    background-size: 100%;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n`;\n"],"names":["base","_exp2","_ref","isScalable","concat","tokens","scaleHover","_exp3","_ref2","Wrapper","styled","name","class","propsAsIs","vars","StatusIcon","Image","Text"],"mappings":";;;;;;;AAMO,IAAMA,IAAI,GAEhB,WAAA;AAAC,IAAAC,KAAA,GAPgBA,SAOhBA,KAAAA,GAAA;AAAA,EAAA,OAae,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,UAAAA,GAAAA,IAAAA,CAAAA,UAAAA,CAAAA;IAAAA,OAAkBA,UAAU,UAAAC,MAAA,CAAUC,oBAAM,CAACC,UAAW,SAAK,GAAI,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GApBnEA,SAoBmEA,KAAAA,GAAA;AAAA,EAAA,OACnE,UAAAC,KAAA,EAAA;AAAA,IAAA,IAAGL,UAAAA,GAAAA,KAAAA,CAAAA,UAAAA,CAAAA;AAAAA,IAAAA,OAAkBA,UAAU,GAAG,SAAS,GAAG,SAAU,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAZnE,IAAMM,OAAO,gBAAGC,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,SAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cAWZb,KAAoE,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACnEM,KAAwD,EAAA,CAAA;AAAA,GAAA;AAAA,CAEzE,EAAA;AAEM,IAAMQ,UAAU,gBAAGL,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI/B,EAAA;AAEM,IAAMG,KAAK,gBAAGN,YAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAI1B,EAAA;AAEM,IAAMI,IAAI,gBAAGP,YAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,MAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUzB;;;;;;;;"}
+{"version":3,"file":"Avatar.styles.js","sources":["../../../src/components/Avatar/Avatar.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\nimport { styled } from '@linaria/react';\n\nimport { component, mergeConfig } from '../../engines';\nimport { badgeConfig, badgeTokens } from '../Badge';\nimport { counterConfig, counterTokens } from '../Counter';\n\nimport { classes, tokens } from './Avatar.tokens';\nimport { AvatarProps } from './Avatar.types';\n\nconst mergedBadgeConfig = mergeConfig(badgeConfig);\nconst Badge = component(mergedBadgeConfig);\n\nconst mergedCounterConfig = mergeConfig(counterConfig);\nconst Counter = component(mergedCounterConfig);\n\nexport const base = css`\n    position: relative;\n`;\n\nexport const Wrapper = styled.div<{ isScalable?: AvatarProps['isScalable'] }>`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n    background: var(${tokens.backgroundColor});\n    overflow: hidden;\n\n    &:hover {\n        scale: ${({ isScalable }) => (isScalable ? `var(${tokens.scaleHover})` : '1')};\n        cursor: ${({ isScalable }) => (isScalable ? 'pointer' : 'inherit')};\n    }\n`;\n\nexport const StatusIcon = styled.div`\n    position: absolute;\n    top: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n    left: calc(1.02 * 0.85 * var(${tokens.avatarSize}) - var(${tokens.statusIconSize}) / 2);\n`;\n\nexport const Image = styled.img`\n    width: 100%;\n    height: 100%;\n    border-radius: 50%;\n`;\n\nexport const Text = styled.span`\n    font-size: var(${tokens.fontSize});\n    font-family: var(${tokens.fontFamily});\n    font-weight: var(${tokens.fontWeight});\n    line-height: var(${tokens.lineHeight});\n    background-image: var(${tokens.color});\n    background-color: var(${tokens.color});\n    background-size: 100%;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n`;\n\nexport const ExtraContent = styled.div`\n    max-width: 100%;\n    display: flex;\n\n    position: absolute;\n    z-index: 2;\n\n    &.${classes.extraPlacementTopLeft} {\n        top: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n        left: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n    }\n\n    &.${classes.extraPlacementTopRight} {\n        top: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n        right: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n    }\n\n    &.${classes.extraPlacementBottomRight} {\n        bottom: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n        right: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n    }\n\n    &.${classes.extraPlacementBottomLeft} {\n        bottom: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n        left: calc(-0.063rem * var(${tokens.extraPlacementFactor}, 0));\n    }\n`;\n\nexport const ExtraBadge = styled(Badge)`\n    ${badgeTokens.background}: var(${tokens.badgeBackground});\n    ${badgeTokens.color}: var(${tokens.badgeColor});\n    ${badgeTokens.backgroundTransparent}: var(${tokens.badgeBackgroundTransparent});\n    ${badgeTokens.colorTransparent}: var(${tokens.badgeColorTransparent});\n    ${badgeTokens.colorClear}: var(${tokens.badgeColorClear});\n    ${badgeTokens.backgroundClear}: var(${tokens.badgeBackgroundClear});\n    ${badgeTokens.borderRadius}: var(${tokens.badgeBorderRadius});\n    ${badgeTokens.pilledBorderRadius}: var(${tokens.badgePilledBorderRadius});\n    ${badgeTokens.height}: var(${tokens.badgeHeight});\n    ${badgeTokens.padding}: var(${tokens.badgePadding});\n    ${badgeTokens.paddingIconOnly}: var(${tokens.badgePaddingIconOnly});\n    ${badgeTokens.fontFamily}: var(${tokens.badgeFontFamily});\n    ${badgeTokens.fontSize}: var(${tokens.badgeFontSize});\n    ${badgeTokens.fontStyle}: var(${tokens.badgeFontStyle});\n    ${badgeTokens.fontWeight}: var(${tokens.badgeFontWeight});\n    ${badgeTokens.letterSpacing}: var(${tokens.badgeLetterSpacing});\n    ${badgeTokens.lineHeight}: var(${tokens.badgeLineHeight});\n    ${badgeTokens.leftContentMarginLeft}: var(${tokens.badgeLeftContentMarginLeft});\n    ${badgeTokens.leftContentMarginRight}: var(${tokens.badgeLeftContentMarginRight});\n    ${badgeTokens.rightContentMarginLeft}: var(${tokens.badgeRightContentMarginLeft});\n    ${badgeTokens.rightContentMarginRight}: var(${tokens.badgeRightContentMarginRight});\n`;\n\nexport const ExtraCounter = styled(Counter)`\n    ${counterTokens.background}: var(${tokens.counterBackground});\n    ${counterTokens.color}: var(${tokens.counterColor});\n    ${counterTokens.borderRadius}: var(${tokens.counterBorderRadius});\n    ${counterTokens.height}: var(${tokens.counterHeight});\n    ${counterTokens.padding}: var(${tokens.counterPadding});\n    ${counterTokens.fontFamily}: var(${tokens.counterFontFamily});\n    ${counterTokens.fontSize}: var(${tokens.counterFontSize});\n    ${counterTokens.fontStyle}: var(${tokens.counterFontStyle});\n    ${counterTokens.fontWeight}: var(${tokens.counterFontWeight});\n    ${counterTokens.letterSpacing}: var(${tokens.counterLetterSpacing});\n    ${counterTokens.lineHeight}: var(${tokens.counterLineHeight});\n`;\n"],"names":["mergedBadgeConfig","mergeConfig","badgeConfig","Badge","component","mergedCounterConfig","counterConfig","Counter","base","_exp2","_ref","isScalable","concat","tokens","scaleHover","_exp3","_ref2","Wrapper","styled","name","class","propsAsIs","vars","StatusIcon","Image","Text","ExtraContent","_exp26","ExtraBadge","_exp69","ExtraCounter"],"mappings":"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"}

package/cjs/components/Avatar/Avatar.styles_131qvfx.css

@@ -0,0 +1,8 @@
+.b1d1rtx8{position:relative;}
+.wxwn3we{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;border-radius:50%;background:var(--plasma-avatar-background);overflow:hidden;}.wxwn3we:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
+.sf2jhi1{position:absolute;top:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);left:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);}
+.igq6ihg{width:100%;height:100%;border-radius:50%;}
+.t1kfsxcq{font-size:var(--plasma-avatar-font-size);font-family:var(--plasma-avatar-font-family);font-weight:var(--plasma-avatar-font-weight);line-height:var(--plasma-avatar-line-height);background-image:var(--plasma-avatar-color);background-color:var(--plasma-avatar-color);background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
+.e1i3umn2{max-width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;z-index:2;}.e1i3umn2.avatar-extra-placement-top-left{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.e1i3umn2.avatar-extra-placement-top-right{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.e1i3umn2.avatar-extra-placement-bottom-right{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.e1i3umn2.avatar-extra-placement-bottom-left{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}
+.eqy70yy{--plasma-badge-background:var(--plasma-avatar-extra-badge-background);--plasma-badge-color:var(--plasma-avatar-extra-badge-color);--plasma-badge-background-transparent:var(--plasma-avatar-extra-badge-background-transparent);--plasma-badge-color-transparent:var(--plasma-avatar-extra-badge-color-transparent);--plasma-badge-color-clear:var(--plasma-avatar-extra-badge-color-clear);--plasma-badge-background-clear:var(--plasma-avatar-extra-badge-background-clear);--plasma-badge-border-radius:var(--plasma-avatar-extra-badge-border-radius);--plasma-badge-pilled-border-radius:var(--plasma-avatar-extra-badge-pilled-border-radius);--plasma-badge-height:var(--plasma-avatar-extra-badge-height);--plasma-badge-padding:var(--plasma-avatar-extra-badge-padding);--plasma-badge-padding-icon-only:var(--plasma-avatar-extra-badge-padding-icon-only);--plasma-badge-font-family:var(--plasma-avatar-extra-badge-font-family);--plasma-badge-font-size:var(--plasma-avatar-extra-badge-font-size);--plasma-badge-font-style:var(--plasma-avatar-extra-badge-font-style);--plasma-badge-font-weight:var(--plasma-avatar-extra-badge-font-weight);--plasma-badge-letter-spacing:var(--plasma-avatar-extra-badge-letter-spacing);--plasma-badge-lineheight:var(--plasma-avatar-extra-badge-lineheight);--plasma-badge-left-content-margin-left:var(--plasma-avatar-extra-badge-left-content-margin-left);--plasma-badge-left-content-margin-right:var(--plasma-avatar-extra-badge-left-content-margin-right);--plasma-badge-right-content-margin-left:var(--plasma-avatar-extra-badge-right-content-margin-left);--plasma-badge-right-content-margin-right:var(--plasma-avatar-extra-badge-right-content-margin-right);}
+.e4nvvok{--plasma-counter-background:var(--plasma-avatar-extra-counter-background);--plasma-counter-color:var(--plasma-avatar-extra-counter-color);--plasma-counter-border-radius:var(--plasma-avatar-extra-counter-border-radius);--plasma-counter-height:var(--plasma-avatar-extra-counter-height);--plasma-counter-padding:var(--plasma-avatar-extra-counter-padding);--plasma-counter-font-family:var(--plasma-avatar-extra-counter-font-family);--plasma-counter-font-size:var(--plasma-avatar-extra-counter-font-size);--plasma-counter-font-style:var(--plasma-avatar-extra-counter-font-style);--plasma-counter-font-weight:var(--plasma-avatar-extra-counter-font-weight);--plasma-counter-letter-spacing:var(--plasma-avatar-extra-counter-letter-spacing);--plasma-counter-lineheight:var(--plasma-avatar-extra-counter-lineheight);}

package/cjs/components/Avatar/Avatar.tokens.js

@@ -3,7 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var classes = {
-  avatarItem: 'avatar-item'
+  avatarItem: 'avatar-item',
+  extraPlacementTopRight: 'avatar-extra-placement-top-right',
+  extraPlacementTopLeft: 'avatar-extra-placement-top-left',
+  extraPlacementBottomLeft: 'avatar-extra-placement-bottom-left',
+  extraPlacementBottomRight: 'avatar-extra-placement-bottom-right'
 };
 var tokens = {
   avatarSize: '--plasma-avatar-size',
@@ -19,7 +23,42 @@ var tokens = {
   outlineColor: '--plasma-avatar-outline-color',
   outlineSize: '--plasma-avatar-outline-size',
   outlineOffset: '--plasma-avatar-outline-offset',
-  scaleHover: '--plasma-avatar-scale-hover'
+  scaleHover: '--plasma-avatar-scale-hover',
+  extraPlacementFactor: '--plasma-avatar-extra-placement-factor',
+  // extra badge tokens
+  badgeBackground: '--plasma-avatar-extra-badge-background',
+  badgeColor: '--plasma-avatar-extra-badge-color',
+  badgeBackgroundTransparent: '--plasma-avatar-extra-badge-background-transparent',
+  badgeColorTransparent: '--plasma-avatar-extra-badge-color-transparent',
+  badgeColorClear: '--plasma-avatar-extra-badge-color-clear',
+  badgeBackgroundClear: '--plasma-avatar-extra-badge-background-clear',
+  badgeBorderRadius: '--plasma-avatar-extra-badge-border-radius',
+  badgePilledBorderRadius: '--plasma-avatar-extra-badge-pilled-border-radius',
+  badgeHeight: '--plasma-avatar-extra-badge-height',
+  badgePadding: '--plasma-avatar-extra-badge-padding',
+  badgePaddingIconOnly: '--plasma-avatar-extra-badge-padding-icon-only',
+  badgeFontFamily: '--plasma-avatar-extra-badge-font-family',
+  badgeFontSize: '--plasma-avatar-extra-badge-font-size',
+  badgeFontStyle: '--plasma-avatar-extra-badge-font-style',
+  badgeFontWeight: '--plasma-avatar-extra-badge-font-weight',
+  badgeLetterSpacing: '--plasma-avatar-extra-badge-letter-spacing',
+  badgeLineHeight: '--plasma-avatar-extra-badge-lineheight',
+  badgeLeftContentMarginLeft: '--plasma-avatar-extra-badge-left-content-margin-left',
+  badgeLeftContentMarginRight: '--plasma-avatar-extra-badge-left-content-margin-right',
+  badgeRightContentMarginLeft: '--plasma-avatar-extra-badge-right-content-margin-left',
+  badgeRightContentMarginRight: '--plasma-avatar-extra-badge-right-content-margin-right',
+  // extra counter tokens
+  counterBackground: '--plasma-avatar-extra-counter-background',
+  counterColor: '--plasma-avatar-extra-counter-color',
+  counterBorderRadius: '--plasma-avatar-extra-counter-border-radius',
+  counterHeight: '--plasma-avatar-extra-counter-height',
+  counterPadding: '--plasma-avatar-extra-counter-padding',
+  counterFontFamily: '--plasma-avatar-extra-counter-font-family',
+  counterFontSize: '--plasma-avatar-extra-counter-font-size',
+  counterFontStyle: '--plasma-avatar-extra-counter-font-style',
+  counterFontWeight: '--plasma-avatar-extra-counter-font-weight',
+  counterLetterSpacing: '--plasma-avatar-extra-counter-letter-spacing',
+  counterLineHeight: '--plasma-avatar-extra-counter-lineheight'
 };
 
 exports.classes = classes;

package/cjs/components/Avatar/Avatar.tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.tokens.js","sources":["../../../src/components/Avatar/Avatar.tokens.ts"],"sourcesContent":["export const classes = {\n    avatarItem: 'avatar-item',\n};\n\nexport const tokens = {\n    avatarSize: '--plasma-avatar-size',\n    fontFamily: '--plasma-avatar-font-family',\n    fontSize: '--plasma-avatar-font-size',\n    color: '--plasma-avatar-color',\n    fontWeight: '--plasma-avatar-font-weight',\n    lineHeight: '--plasma-avatar-line-height',\n    backgroundColor: '--plasma-avatar-background',\n    statusIconSize: '--plasma-status-icon-size',\n    statusOnlineColor: '--plasma-avatar-status-online-background',\n    statusOfflineColor: '--plasma-avatar-status-offline-background',\n    outlineColor: '--plasma-avatar-outline-color',\n    outlineSize: '--plasma-avatar-outline-size',\n    outlineOffset: '--plasma-avatar-outline-offset',\n    scaleHover: '--plasma-avatar-scale-hover',\n};\n"],"names":["classes","avatarItem","tokens","avatarSize","fontFamily","fontSize","color","fontWeight","lineHeight","backgroundColor","statusIconSize","statusOnlineColor","statusOfflineColor","outlineColor","outlineSize","outlineOffset","scaleHover"],"mappings":";;;;AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,aAAA;AAChB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,sBAAsB;AAClCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,KAAK,EAAE,uBAAuB;AAC9BC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,eAAe,EAAE,4BAA4B;AAC7CC,EAAAA,cAAc,EAAE,2BAA2B;AAC3CC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,kBAAkB,EAAE,2CAA2C;AAC/DC,EAAAA,YAAY,EAAE,+BAA+B;AAC7CC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAAA;AAChB;;;;;"}
+{"version":3,"file":"Avatar.tokens.js","sources":["../../../src/components/Avatar/Avatar.tokens.ts"],"sourcesContent":["export const classes = {\n    avatarItem: 'avatar-item',\n    extraPlacementTopRight: 'avatar-extra-placement-top-right',\n    extraPlacementTopLeft: 'avatar-extra-placement-top-left',\n    extraPlacementBottomLeft: 'avatar-extra-placement-bottom-left',\n    extraPlacementBottomRight: 'avatar-extra-placement-bottom-right',\n};\n\nexport const tokens = {\n    avatarSize: '--plasma-avatar-size',\n    fontFamily: '--plasma-avatar-font-family',\n    fontSize: '--plasma-avatar-font-size',\n    color: '--plasma-avatar-color',\n    fontWeight: '--plasma-avatar-font-weight',\n    lineHeight: '--plasma-avatar-line-height',\n    backgroundColor: '--plasma-avatar-background',\n    statusIconSize: '--plasma-status-icon-size',\n    statusOnlineColor: '--plasma-avatar-status-online-background',\n    statusOfflineColor: '--plasma-avatar-status-offline-background',\n    outlineColor: '--plasma-avatar-outline-color',\n    outlineSize: '--plasma-avatar-outline-size',\n    outlineOffset: '--plasma-avatar-outline-offset',\n    scaleHover: '--plasma-avatar-scale-hover',\n    extraPlacementFactor: '--plasma-avatar-extra-placement-factor',\n\n    // extra badge tokens\n    badgeBackground: '--plasma-avatar-extra-badge-background',\n    badgeColor: '--plasma-avatar-extra-badge-color',\n    badgeBackgroundTransparent: '--plasma-avatar-extra-badge-background-transparent',\n    badgeColorTransparent: '--plasma-avatar-extra-badge-color-transparent',\n    badgeColorClear: '--plasma-avatar-extra-badge-color-clear',\n    badgeBackgroundClear: '--plasma-avatar-extra-badge-background-clear',\n\n    badgeBorderRadius: '--plasma-avatar-extra-badge-border-radius',\n    badgePilledBorderRadius: '--plasma-avatar-extra-badge-pilled-border-radius',\n    badgeHeight: '--plasma-avatar-extra-badge-height',\n    badgePadding: '--plasma-avatar-extra-badge-padding',\n    badgePaddingIconOnly: '--plasma-avatar-extra-badge-padding-icon-only',\n\n    badgeFontFamily: '--plasma-avatar-extra-badge-font-family',\n    badgeFontSize: '--plasma-avatar-extra-badge-font-size',\n    badgeFontStyle: '--plasma-avatar-extra-badge-font-style',\n    badgeFontWeight: '--plasma-avatar-extra-badge-font-weight',\n    badgeLetterSpacing: '--plasma-avatar-extra-badge-letter-spacing',\n    badgeLineHeight: '--plasma-avatar-extra-badge-lineheight',\n\n    badgeLeftContentMarginLeft: '--plasma-avatar-extra-badge-left-content-margin-left',\n    badgeLeftContentMarginRight: '--plasma-avatar-extra-badge-left-content-margin-right',\n    badgeRightContentMarginLeft: '--plasma-avatar-extra-badge-right-content-margin-left',\n    badgeRightContentMarginRight: '--plasma-avatar-extra-badge-right-content-margin-right',\n\n    // extra counter tokens\n    counterBackground: '--plasma-avatar-extra-counter-background',\n    counterColor: '--plasma-avatar-extra-counter-color',\n\n    counterBorderRadius: '--plasma-avatar-extra-counter-border-radius',\n    counterHeight: '--plasma-avatar-extra-counter-height',\n    counterPadding: '--plasma-avatar-extra-counter-padding',\n\n    counterFontFamily: '--plasma-avatar-extra-counter-font-family',\n    counterFontSize: '--plasma-avatar-extra-counter-font-size',\n    counterFontStyle: '--plasma-avatar-extra-counter-font-style',\n    counterFontWeight: '--plasma-avatar-extra-counter-font-weight',\n    counterLetterSpacing: '--plasma-avatar-extra-counter-letter-spacing',\n    counterLineHeight: '--plasma-avatar-extra-counter-lineheight',\n};\n"],"names":["classes","avatarItem","extraPlacementTopRight","extraPlacementTopLeft","extraPlacementBottomLeft","extraPlacementBottomRight","tokens","avatarSize","fontFamily","fontSize","color","fontWeight","lineHeight","backgroundColor","statusIconSize","statusOnlineColor","statusOfflineColor","outlineColor","outlineSize","outlineOffset","scaleHover","extraPlacementFactor","badgeBackground","badgeColor","badgeBackgroundTransparent","badgeColorTransparent","badgeColorClear","badgeBackgroundClear","badgeBorderRadius","badgePilledBorderRadius","badgeHeight","badgePadding","badgePaddingIconOnly","badgeFontFamily","badgeFontSize","badgeFontStyle","badgeFontWeight","badgeLetterSpacing","badgeLineHeight","badgeLeftContentMarginLeft","badgeLeftContentMarginRight","badgeRightContentMarginLeft","badgeRightContentMarginRight","counterBackground","counterColor","counterBorderRadius","counterHeight","counterPadding","counterFontFamily","counterFontSize","counterFontStyle","counterFontWeight","counterLetterSpacing","counterLineHeight"],"mappings":";;;;AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,UAAU,EAAE,aAAa;AACzBC,EAAAA,sBAAsB,EAAE,kCAAkC;AAC1DC,EAAAA,qBAAqB,EAAE,iCAAiC;AACxDC,EAAAA,wBAAwB,EAAE,oCAAoC;AAC9DC,EAAAA,yBAAyB,EAAE,qCAAA;AAC/B,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,UAAU,EAAE,sBAAsB;AAClCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,QAAQ,EAAE,2BAA2B;AACrCC,EAAAA,KAAK,EAAE,uBAAuB;AAC9BC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,eAAe,EAAE,4BAA4B;AAC7CC,EAAAA,cAAc,EAAE,2BAA2B;AAC3CC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,kBAAkB,EAAE,2CAA2C;AAC/DC,EAAAA,YAAY,EAAE,+BAA+B;AAC7CC,EAAAA,WAAW,EAAE,8BAA8B;AAC3CC,EAAAA,aAAa,EAAE,gCAAgC;AAC/CC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,oBAAoB,EAAE,wCAAwC;AAE9D;AACAC,EAAAA,eAAe,EAAE,wCAAwC;AACzDC,EAAAA,UAAU,EAAE,mCAAmC;AAC/CC,EAAAA,0BAA0B,EAAE,oDAAoD;AAChFC,EAAAA,qBAAqB,EAAE,+CAA+C;AACtEC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,oBAAoB,EAAE,8CAA8C;AAEpEC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,uBAAuB,EAAE,kDAAkD;AAC3EC,EAAAA,WAAW,EAAE,oCAAoC;AACjDC,EAAAA,YAAY,EAAE,qCAAqC;AACnDC,EAAAA,oBAAoB,EAAE,+CAA+C;AAErEC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,aAAa,EAAE,uCAAuC;AACtDC,EAAAA,cAAc,EAAE,wCAAwC;AACxDC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,kBAAkB,EAAE,4CAA4C;AAChEC,EAAAA,eAAe,EAAE,wCAAwC;AAEzDC,EAAAA,0BAA0B,EAAE,sDAAsD;AAClFC,EAAAA,2BAA2B,EAAE,uDAAuD;AACpFC,EAAAA,2BAA2B,EAAE,uDAAuD;AACpFC,EAAAA,4BAA4B,EAAE,wDAAwD;AAEtF;AACAC,EAAAA,iBAAiB,EAAE,0CAA0C;AAC7DC,EAAAA,YAAY,EAAE,qCAAqC;AAEnDC,EAAAA,mBAAmB,EAAE,6CAA6C;AAClEC,EAAAA,aAAa,EAAE,sCAAsC;AACrDC,EAAAA,cAAc,EAAE,uCAAuC;AAEvDC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,eAAe,EAAE,yCAAyC;AAC1DC,EAAAA,gBAAgB,EAAE,0CAA0C;AAC5DC,EAAAA,iBAAiB,EAAE,2CAA2C;AAC9DC,EAAAA,oBAAoB,EAAE,8CAA8C;AACpEC,EAAAA,iBAAiB,EAAE,0CAAA;AACvB;;;;;"}

package/cjs/components/Avatar/utils/index.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Avatar_tokens = require('../Avatar.tokens.js');
+
+var extraPlacementMap = function extraPlacementMap(extraPlacement) {
+  switch (extraPlacement) {
+    case 'top-left':
+      return Avatar_tokens.classes.extraPlacementTopLeft;
+    case 'bottom-left':
+      return Avatar_tokens.classes.extraPlacementBottomLeft;
+    case 'bottom-right':
+      return Avatar_tokens.classes.extraPlacementBottomRight;
+    default:
+      return Avatar_tokens.classes.extraPlacementTopRight;
+  }
+};
+
+exports.extraPlacementMap = extraPlacementMap;
+//# sourceMappingURL=index.js.map

package/cjs/components/Avatar/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/Avatar/utils/index.tsx"],"sourcesContent":["import { classes } from '../Avatar.tokens';\n\nexport { getInitialsForName } from './getInitialsForName';\n\nexport const extraPlacementMap = (extraPlacement?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right') => {\n    switch (extraPlacement) {\n        case 'top-left':\n            return classes.extraPlacementTopLeft;\n        case 'bottom-left':\n            return classes.extraPlacementBottomLeft;\n        case 'bottom-right':\n            return classes.extraPlacementBottomRight;\n        default:\n            return classes.extraPlacementTopRight;\n    }\n};\n"],"names":["extraPlacementMap","extraPlacement","classes","extraPlacementTopLeft","extraPlacementBottomLeft","extraPlacementBottomRight","extraPlacementTopRight"],"mappings":";;;;;;IAIaA,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,cAA0E,EAAK;AAC7G,EAAA,QAAQA,cAAc;AAClB,IAAA,KAAK,UAAU;MACX,OAAOC,qBAAO,CAACC,qBAAqB,CAAA;AACxC,IAAA,KAAK,aAAa;MACd,OAAOD,qBAAO,CAACE,wBAAwB,CAAA;AAC3C,IAAA,KAAK,cAAc;MACf,OAAOF,qBAAO,CAACG,yBAAyB,CAAA;AAC5C,IAAA;MACI,OAAOH,qBAAO,CAACI,sBAAsB,CAAA;AAC7C,GAAA;AACJ;;;;"}

package/cjs/index.css

@@ -496,11 +496,14 @@
 
 .Counter_styles_1uue90v_b1dqw7l5__00d0b847{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:-webkit-max-content;width:-moz-max-content;width:max-content;}
 
-.Avatar_styles_1gd252x_b1d1rtx8__7885bc3b{position:relative;}
-.Avatar_styles_1gd252x_wxwn3we__7885bc3b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;border-radius:50%;background:var(--plasma-avatar-background);overflow:hidden;}.Avatar_styles_1gd252x_wxwn3we__7885bc3b:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
-.Avatar_styles_1gd252x_sf2jhi1__7885bc3b{position:absolute;top:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);left:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);}
-.Avatar_styles_1gd252x_igq6ihg__7885bc3b{width:100%;height:100%;border-radius:50%;}
-.Avatar_styles_1gd252x_t1kfsxcq__7885bc3b{font-size:var(--plasma-avatar-font-size);font-family:var(--plasma-avatar-font-family);font-weight:var(--plasma-avatar-font-weight);line-height:var(--plasma-avatar-line-height);background-image:var(--plasma-avatar-color);background-color:var(--plasma-avatar-color);background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
+.Avatar_styles_131qvfx_b1d1rtx8__45209762{position:relative;}
+.Avatar_styles_131qvfx_wxwn3we__45209762{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;border-radius:50%;background:var(--plasma-avatar-background);overflow:hidden;}.Avatar_styles_131qvfx_wxwn3we__45209762:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
+.Avatar_styles_131qvfx_sf2jhi1__45209762{position:absolute;top:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);left:calc(1.02 * 0.85 * var(--plasma-avatar-size) - var(--plasma-status-icon-size) / 2);}
+.Avatar_styles_131qvfx_igq6ihg__45209762{width:100%;height:100%;border-radius:50%;}
+.Avatar_styles_131qvfx_t1kfsxcq__45209762{font-size:var(--plasma-avatar-font-size);font-family:var(--plasma-avatar-font-family);font-weight:var(--plasma-avatar-font-weight);line-height:var(--plasma-avatar-line-height);background-image:var(--plasma-avatar-color);background-color:var(--plasma-avatar-color);background-size:100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
+.Avatar_styles_131qvfx_e1i3umn2__45209762{max-width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;z-index:2;}.Avatar_styles_131qvfx_e1i3umn2__45209762.Avatar_styles_131qvfx_avatarExtraPlacementTopLeft__45209762{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_131qvfx_e1i3umn2__45209762.Avatar_styles_131qvfx_avatarExtraPlacementTopRight__45209762{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_131qvfx_e1i3umn2__45209762.Avatar_styles_131qvfx_avatarExtraPlacementBottomRight__45209762{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_131qvfx_e1i3umn2__45209762.Avatar_styles_131qvfx_avatarExtraPlacementBottomLeft__45209762{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}
+.Avatar_styles_131qvfx_eqy70yy__45209762{--plasma-badge-background:var(--plasma-avatar-extra-badge-background);--plasma-badge-color:var(--plasma-avatar-extra-badge-color);--plasma-badge-background-transparent:var(--plasma-avatar-extra-badge-background-transparent);--plasma-badge-color-transparent:var(--plasma-avatar-extra-badge-color-transparent);--plasma-badge-color-clear:var(--plasma-avatar-extra-badge-color-clear);--plasma-badge-background-clear:var(--plasma-avatar-extra-badge-background-clear);--plasma-badge-border-radius:var(--plasma-avatar-extra-badge-border-radius);--plasma-badge-pilled-border-radius:var(--plasma-avatar-extra-badge-pilled-border-radius);--plasma-badge-height:var(--plasma-avatar-extra-badge-height);--plasma-badge-padding:var(--plasma-avatar-extra-badge-padding);--plasma-badge-padding-icon-only:var(--plasma-avatar-extra-badge-padding-icon-only);--plasma-badge-font-family:var(--plasma-avatar-extra-badge-font-family);--plasma-badge-font-size:var(--plasma-avatar-extra-badge-font-size);--plasma-badge-font-style:var(--plasma-avatar-extra-badge-font-style);--plasma-badge-font-weight:var(--plasma-avatar-extra-badge-font-weight);--plasma-badge-letter-spacing:var(--plasma-avatar-extra-badge-letter-spacing);--plasma-badge-lineheight:var(--plasma-avatar-extra-badge-lineheight);--plasma-badge-left-content-margin-left:var(--plasma-avatar-extra-badge-left-content-margin-left);--plasma-badge-left-content-margin-right:var(--plasma-avatar-extra-badge-left-content-margin-right);--plasma-badge-right-content-margin-left:var(--plasma-avatar-extra-badge-right-content-margin-left);--plasma-badge-right-content-margin-right:var(--plasma-avatar-extra-badge-right-content-margin-right);}
+.Avatar_styles_131qvfx_e4nvvok__45209762{--plasma-counter-background:var(--plasma-avatar-extra-counter-background);--plasma-counter-color:var(--plasma-avatar-extra-counter-color);--plasma-counter-border-radius:var(--plasma-avatar-extra-counter-border-radius);--plasma-counter-height:var(--plasma-avatar-extra-counter-height);--plasma-counter-padding:var(--plasma-avatar-extra-counter-padding);--plasma-counter-font-family:var(--plasma-avatar-extra-counter-font-family);--plasma-counter-font-size:var(--plasma-avatar-extra-counter-font-size);--plasma-counter-font-style:var(--plasma-avatar-extra-counter-font-style);--plasma-counter-font-weight:var(--plasma-avatar-extra-counter-font-weight);--plasma-counter-letter-spacing:var(--plasma-avatar-extra-counter-letter-spacing);--plasma-counter-lineheight:var(--plasma-avatar-extra-counter-lineheight);}
 
 .base_1vhlhpd_bf4ss7k__c5337153{width:var(--plasma-avatar-size);height:var(--plasma-avatar-size);}
 

package/emotion/cjs/components/Avatar/Avatar.js

@@ -15,7 +15,7 @@ var _Avatar2 = /*#__PURE__*/require("./Avatar.styles");
 var _base2 = /*#__PURE__*/require("./variations/_size/base");
 var _base3 = /*#__PURE__*/require("./variations/_focused/base");
 var _utils2 = /*#__PURE__*/require("./utils");
-var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels"];
+var _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "statusLabels", "hasExtra", "extraPlacement", "type", "counterView", "count", "maxCount", "badgeView", "text", "customColor", "customBackgroundColor", "contentLeft", "contentRight", "pilled"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -69,7 +69,7 @@ var StyledIndicator = /*#__PURE__*/(0, _base["default"])(Indicator, {
 })(_Indicator.indicatorTokens.size, ":var(", _Avatar.tokens.statusIconSize, ");", _Indicator.indicatorTokens.color, ":", function (_ref3) {
   var status = _ref3.status;
   return status === 'active' ? "var(".concat(_Avatar.tokens.statusOnlineColor, ")") : "var(".concat(_Avatar.tokens.statusOfflineColor, ")");
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQXZhdGFyL0F2YXRhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkR5QyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL0F2YXRhci9BdmF0YXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYsIHVzZU1lbW8sIFJlYWN0RWxlbWVudCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgUm9vdFByb3BzLCBjb21wb25lbnQsIG1lcmdlQ29uZmlnIH0gZnJvbSAnLi4vLi4vZW5naW5lcyc7XG5pbXBvcnQgeyBjeCB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IGluZGljYXRvckNvbmZpZywgaW5kaWNhdG9yVG9rZW5zIH0gZnJvbSAnLi4vSW5kaWNhdG9yJztcblxuaW1wb3J0IHsgY2xhc3NlcywgdG9rZW5zIH0gZnJvbSAnLi9BdmF0YXIudG9rZW5zJztcbmltcG9ydCB7IGJhc2UsIFdyYXBwZXIsIEltYWdlLCBTdGF0dXNJY29uLCBUZXh0IH0gZnJvbSAnLi9BdmF0YXIuc3R5bGVzJztcbmltcG9ydCB7IGJhc2UgYXMgdmlld0NTUyB9IGZyb20gJy4vdmFyaWF0aW9ucy9fc2l6ZS9iYXNlJztcbmltcG9ydCB7IGJhc2UgYXMgZm9jdXNlZENTUyB9IGZyb20gJy4vdmFyaWF0aW9ucy9fZm9jdXNlZC9iYXNlJztcbmltcG9ydCB7IGdldEluaXRpYWxzRm9yTmFtZSB9IGZyb20gJy4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBBdmF0YXJQcm9wcywgU3RhdHVzTGFiZWxzIH0gZnJvbSAnLi9BdmF0YXIudHlwZXMnO1xuXG5jb25zdCBTdGF0dXNMYWJlbHNEZWZhdWx0OiBTdGF0dXNMYWJlbHMgPSB7XG4gICAgYWN0aXZlOiAn0JDQutGC0LjQstC10L0nLFxuICAgIGluYWN0aXZlOiAn0J3QtdCw0LrRgtC40LLQtdC9Jyxcbn07XG5cbmNvbnN0IGdldEF2YXRhckNvbnRlbnQgPSAoe1xuICAgIGN1c3RvbVRleHQsXG4gICAgdXJsLFxuICAgIGluaXRpYWxzLFxuICAgIG5hbWUsXG59OiBPbWl0PEF2YXRhclByb3BzLCAnc2l6ZSc+ICYgeyBpbml0aWFscz86IHN0cmluZyB9KTogUmVhY3RFbGVtZW50ID0+IHtcbiAgICBpZiAoY3VzdG9tVGV4dCkge1xuICAgICAgICByZXR1cm4gPFRleHQ+e2N1c3RvbVRleHR9PC9UZXh0PjtcbiAgICB9XG5cbiAgICBpZiAodXJsKSB7XG4gICAgICAgIHJldHVybiA8SW1hZ2Ugc3JjPXt1cmx9IGFsdD17bmFtZX0gLz47XG4gICAgfVxuXG4gICAgcmV0dXJuIDxUZXh0Pntpbml0aWFsc308L1RleHQ+O1xufTtcblxuY29uc3QgZ2V0QXJpYUxhYmVsID0gKHtcbiAgICB1cmwsXG4gICAgbmFtZSxcbiAgICBzdGF0dXMsXG4gICAgJ2FyaWEtbGFiZWwnOiBhcmlhTGFiZWxQcm9wLFxuICAgIHN0YXR1c0xhYmVscyxcbn06IFBpY2s8QXZhdGFyUHJvcHMsICd1cmwnIHwgJ3N0YXR1cycgfCAnbmFtZScgfCAnYXJpYS1sYWJlbCc+ICYge1xuICAgIHN0YXR1c0xhYmVsczogU3RhdHVzTGFiZWxzO1xufSkgPT4ge1xuICAgIGlmICghdXJsKSB7XG4gICAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICAvLyBJTkZPOiDQstC60LvRjtGH0LDQtdC8IGFyaWEtbGFiZWwg0YfRgtC+0LHRiyDQvtC30LLRg9GH0LjRgtGMINGH0YLQviDQvdCwINC40LfQvtCx0YDQsNC20LXQvdC40LhcbiAgICBjb25zdCBhcmlhTGFiZWwgPSAhYXJpYUxhYmVsUHJvcCB8fCBhcmlhTGFiZWxQcm9wLnRyaW0oKSA9PT0gJycgPyBuYW1lIDogYXJpYUxhYmVsUHJvcDtcblxuICAgIHJldHVybiBzdGF0dXMgPyBgJHthcmlhTGFiZWx9LiAke3N0YXR1c0xhYmVsc1tzdGF0dXNdfWAgOiBhcmlhTGFiZWw7XG59O1xuXG5jb25zdCBtZXJnZWRDb25maWcgPSBtZXJnZUNvbmZpZyhpbmRpY2F0b3JDb25maWcpO1xuXG5jb25zdCBJbmRpY2F0b3I6IFJlYWN0LkZ1bmN0aW9uQ29tcG9uZW50PFxuICAgIFJlYWN0LkhUTUxBdHRyaWJ1dGVzPEhUTUxEaXZFbGVtZW50PiAmIHsgc3RhdHVzOiBBdmF0YXJQcm9wc1snc3RhdHVzJ10gfVxuPiA9IGNvbXBvbmVudChtZXJnZWRDb25maWcpIGFzIG5ldmVyO1xuXG5jb25zdCBTdHlsZWRJbmRpY2F0b3IgPSBzdHlsZWQoSW5kaWNhdG9yKWBcbiAgICAke2luZGljYXRvclRva2Vucy5zaXplfTogdmFyKCR7dG9rZW5zLnN0YXR1c0ljb25TaXplfSk7XG4gICAgJHtpbmRpY2F0b3JUb2tlbnMuY29sb3J9OiAkeyh7IHN0YXR1cyB9KSA9PlxuICAgIHN0YXR1cyA9PT0gJ2FjdGl2ZScgPyBgdmFyKCR7dG9rZW5zLnN0YXR1c09ubGluZUNvbG9yfSlgIDogYHZhcigke3Rva2Vucy5zdGF0dXNPZmZsaW5lQ29sb3J9KWB9XG5gO1xuXG5leHBvcnQgY29uc3QgYXZhdGFyUm9vdCA9IChSb290OiBSb290UHJvcHM8SFRNTERpdkVsZW1lbnQsIEF2YXRhclByb3BzPikgPT4ge1xuICAgIHJldHVybiBmb3J3YXJkUmVmPEhUTUxEaXZFbGVtZW50LCBBdmF0YXJQcm9wcz4oKHByb3BzLCByZWYpID0+IHtcbiAgICAgICAgY29uc3Qge1xuICAgICAgICAgICAgc2l6ZTogYXZhdGFyU2l6ZSxcbiAgICAgICAgICAgIG5hbWUsXG4gICAgICAgICAgICB1cmwsXG4gICAgICAgICAgICBjdXN0b21UZXh0LFxuICAgICAgICAgICAgc3RhdHVzLFxuICAgICAgICAgICAgY2xhc3NOYW1lLFxuICAgICAgICAgICAgZm9jdXNlZCA9IHRydWUsXG4gICAgICAgICAgICBpc1NjYWxhYmxlLFxuICAgICAgICAgICAgc3RhdHVzTGFiZWxzID0gU3RhdHVzTGFiZWxzRGVmYXVsdCxcbiAgICAgICAgICAgIC4uLnJlc3RcbiAgICAgICAgfSA9IHByb3BzO1xuXG4gICAgICAgIGNvbnN0IGluaXRpYWxzID0gdXNlTWVtbygoKSA9PiBnZXRJbml0aWFsc0Zvck5hbWUobmFtZSksIFtuYW1lXSk7XG4gICAgICAgIGNvbnN0IGFyaWFMYWJlbCA9IGdldEFyaWFMYWJlbCh7XG4gICAgICAgICAgICAuLi5wcm9wcyxcbiAgICAgICAgICAgIHN0YXR1c0xhYmVscyxcbiAgICAgICAgfSk7XG5cbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICAgIDxSb290XG4gICAgICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgICAgICAgc2l6ZT17YXZhdGFyU2l6ZX1cbiAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2N4KGNsYXNzZXMuYXZhdGFySXRlbSwgY2xhc3NOYW1lKX1cbiAgICAgICAgICAgICAgICBhcmlhLWxhYmVsPXthcmlhTGFiZWx9XG4gICAgICAgICAgICAgICAgZm9jdXNlZD17Zm9jdXNlZH1cbiAgICAgICAgICAgICAgICB7Li4ucmVzdH1cbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8V3JhcHBlciBpc1NjYWxhYmxlPXtpc1NjYWxhYmxlfT57Z2V0QXZhdGFyQ29udGVudCh7IGN1c3RvbVRleHQsIHVybCwgaW5pdGlhbHMsIG5hbWUgfSl9PC9XcmFwcGVyPlxuXG4gICAgICAgICAgICAgICAge3N0YXR1cyAmJiAoXG4gICAgICAgICAgICAgICAgICAgIDxTdGF0dXNJY29uPlxuICAgICAgICAgICAgICAgICAgICAgICAgPFN0eWxlZEluZGljYXRvciBhcmlhLWxhYmVsPXtzdGF0dXNMYWJlbHNbc3RhdHVzXX0gc3RhdHVzPXtzdGF0dXN9IC8+XG4gICAgICAgICAgICAgICAgICAgIDwvU3RhdHVzSWNvbj5cbiAgICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgPC9Sb290PlxuICAgICAgICApO1xuICAgIH0pO1xufTtcblxuZXhwb3J0IGNvbnN0IGF2YXRhckNvbmZpZyA9IHtcbiAgICBuYW1lOiAnQXZhdGFyJyxcbiAgICB0YWc6ICdkaXYnLFxuICAgIGxheW91dDogYXZhdGFyUm9vdCxcbiAgICBiYXNlLFxuICAgIHZhcmlhdGlvbnM6IHtcbiAgICAgICAgc2l6ZToge1xuICAgICAgICAgICAgY3NzOiB2aWV3Q1NTLFxuICAgICAgICB9LFxuICAgICAgICBmb2N1c2VkOiB7XG4gICAgICAgICAgICBjc3M6IGZvY3VzZWRDU1MsXG4gICAgICAgIH0sXG4gICAgfSxcbiAgICBkZWZhdWx0czoge1xuICAgICAgICBzaXplOiAnbScsXG4gICAgfSxcbn07XG4iXX0= */"));
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvQXZhdGFyL0F2YXRhci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkR5QyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL0F2YXRhci9BdmF0YXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGZvcndhcmRSZWYsIHVzZU1lbW8sIFJlYWN0RWxlbWVudCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgUm9vdFByb3BzLCBjb21wb25lbnQsIG1lcmdlQ29uZmlnIH0gZnJvbSAnLi4vLi4vZW5naW5lcyc7XG5pbXBvcnQgeyBjeCB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IGluZGljYXRvckNvbmZpZywgaW5kaWNhdG9yVG9rZW5zIH0gZnJvbSAnLi4vSW5kaWNhdG9yJztcblxuaW1wb3J0IHsgY2xhc3NlcywgdG9rZW5zIH0gZnJvbSAnLi9BdmF0YXIudG9rZW5zJztcbmltcG9ydCB7IGJhc2UsIFdyYXBwZXIsIEltYWdlLCBTdGF0dXNJY29uLCBUZXh0LCBFeHRyYUNvbnRlbnQsIEV4dHJhQ291bnRlciwgRXh0cmFCYWRnZSB9IGZyb20gJy4vQXZhdGFyLnN0eWxlcyc7XG5pbXBvcnQgeyBiYXNlIGFzIHZpZXdDU1MgfSBmcm9tICcuL3ZhcmlhdGlvbnMvX3NpemUvYmFzZSc7XG5pbXBvcnQgeyBiYXNlIGFzIGZvY3VzZWRDU1MgfSBmcm9tICcuL3ZhcmlhdGlvbnMvX2ZvY3VzZWQvYmFzZSc7XG5pbXBvcnQgeyBleHRyYVBsYWNlbWVudE1hcCwgZ2V0SW5pdGlhbHNGb3JOYW1lIH0gZnJvbSAnLi91dGlscyc7XG5pbXBvcnQgdHlwZSB7IEF2YXRhclByb3BzLCBTdGF0dXNMYWJlbHMgfSBmcm9tICcuL0F2YXRhci50eXBlcyc7XG5cbmNvbnN0IFN0YXR1c0xhYmVsc0RlZmF1bHQ6IFN0YXR1c0xhYmVscyA9IHtcbiAgICBhY3RpdmU6ICfQkNC60YLQuNCy0LXQvScsXG4gICAgaW5hY3RpdmU6ICfQndC10LDQutGC0LjQstC10L0nLFxufTtcblxuY29uc3QgZ2V0QXZhdGFyQ29udGVudCA9ICh7XG4gICAgY3VzdG9tVGV4dCxcbiAgICB1cmwsXG4gICAgaW5pdGlhbHMsXG4gICAgbmFtZSxcbn06IE9taXQ8QXZhdGFyUHJvcHMsICdzaXplJz4gJiB7IGluaXRpYWxzPzogc3RyaW5nIH0pOiBSZWFjdEVsZW1lbnQgPT4ge1xuICAgIGlmIChjdXN0b21UZXh0KSB7XG4gICAgICAgIHJldHVybiA8VGV4dD57Y3VzdG9tVGV4dH08L1RleHQ+O1xuICAgIH1cblxuICAgIGlmICh1cmwpIHtcbiAgICAgICAgcmV0dXJuIDxJbWFnZSBzcmM9e3VybH0gYWx0PXtuYW1lfSAvPjtcbiAgICB9XG5cbiAgICByZXR1cm4gPFRleHQ+e2luaXRpYWxzfTwvVGV4dD47XG59O1xuXG5jb25zdCBnZXRBcmlhTGFiZWwgPSAoe1xuICAgIHVybCxcbiAgICBuYW1lLFxuICAgIHN0YXR1cyxcbiAgICAnYXJpYS1sYWJlbCc6IGFyaWFMYWJlbFByb3AsXG4gICAgc3RhdHVzTGFiZWxzLFxufTogUGljazxBdmF0YXJQcm9wcywgJ3VybCcgfCAnc3RhdHVzJyB8ICduYW1lJyB8ICdhcmlhLWxhYmVsJz4gJiB7XG4gICAgc3RhdHVzTGFiZWxzOiBTdGF0dXNMYWJlbHM7XG59KSA9PiB7XG4gICAgaWYgKCF1cmwpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIC8vIElORk86INCy0LrQu9GO0YfQsNC10LwgYXJpYS1sYWJlbCDRh9GC0L7QsdGLINC+0LfQstGD0YfQuNGC0Ywg0YfRgtC+INC90LAg0LjQt9C+0LHRgNCw0LbQtdC90LjQuFxuICAgIGNvbnN0IGFyaWFMYWJlbCA9ICFhcmlhTGFiZWxQcm9wIHx8IGFyaWFMYWJlbFByb3AudHJpbSgpID09PSAnJyA/IG5hbWUgOiBhcmlhTGFiZWxQcm9wO1xuXG4gICAgcmV0dXJuIHN0YXR1cyA/IGAke2FyaWFMYWJlbH0uICR7c3RhdHVzTGFiZWxzW3N0YXR1c119YCA6IGFyaWFMYWJlbDtcbn07XG5cbmNvbnN0IG1lcmdlZENvbmZpZyA9IG1lcmdlQ29uZmlnKGluZGljYXRvckNvbmZpZyk7XG5cbmNvbnN0IEluZGljYXRvcjogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8XG4gICAgUmVhY3QuSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+ICYgeyBzdGF0dXM6IEF2YXRhclByb3BzWydzdGF0dXMnXSB9XG4+ID0gY29tcG9uZW50KG1lcmdlZENvbmZpZykgYXMgbmV2ZXI7XG5cbmNvbnN0IFN0eWxlZEluZGljYXRvciA9IHN0eWxlZChJbmRpY2F0b3IpYFxuICAgICR7aW5kaWNhdG9yVG9rZW5zLnNpemV9OiB2YXIoJHt0b2tlbnMuc3RhdHVzSWNvblNpemV9KTtcbiAgICAke2luZGljYXRvclRva2Vucy5jb2xvcn06ICR7KHsgc3RhdHVzIH0pID0+XG4gICAgc3RhdHVzID09PSAnYWN0aXZlJyA/IGB2YXIoJHt0b2tlbnMuc3RhdHVzT25saW5lQ29sb3J9KWAgOiBgdmFyKCR7dG9rZW5zLnN0YXR1c09mZmxpbmVDb2xvcn0pYH1cbmA7XG5cbmV4cG9ydCBjb25zdCBhdmF0YXJSb290ID0gKFJvb3Q6IFJvb3RQcm9wczxIVE1MRGl2RWxlbWVudCwgQXZhdGFyUHJvcHM+KSA9PiB7XG4gICAgcmV0dXJuIGZvcndhcmRSZWY8SFRNTERpdkVsZW1lbnQsIEF2YXRhclByb3BzPigocHJvcHMsIHJlZikgPT4ge1xuICAgICAgICBjb25zdCB7XG4gICAgICAgICAgICBzaXplOiBhdmF0YXJTaXplLFxuICAgICAgICAgICAgbmFtZSxcbiAgICAgICAgICAgIHVybCxcbiAgICAgICAgICAgIGN1c3RvbVRleHQsXG4gICAgICAgICAgICBzdGF0dXMsXG4gICAgICAgICAgICBjbGFzc05hbWUsXG4gICAgICAgICAgICBmb2N1c2VkID0gdHJ1ZSxcbiAgICAgICAgICAgIGlzU2NhbGFibGUsXG4gICAgICAgICAgICBzdGF0dXNMYWJlbHMgPSBTdGF0dXNMYWJlbHNEZWZhdWx0LFxuICAgICAgICAgICAgaGFzRXh0cmEsXG4gICAgICAgICAgICBleHRyYVBsYWNlbWVudCxcblxuICAgICAgICAgICAgdHlwZSxcblxuICAgICAgICAgICAgY291bnRlclZpZXcsXG4gICAgICAgICAgICBjb3VudCxcbiAgICAgICAgICAgIG1heENvdW50LFxuXG4gICAgICAgICAgICBiYWRnZVZpZXcsXG4gICAgICAgICAgICB0ZXh0LFxuICAgICAgICAgICAgY3VzdG9tQ29sb3IsXG4gICAgICAgICAgICBjdXN0b21CYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgICBjb250ZW50TGVmdCxcbiAgICAgICAgICAgIGNvbnRlbnRSaWdodCxcbiAgICAgICAgICAgIHBpbGxlZCxcblxuICAgICAgICAgICAgLi4ucmVzdFxuICAgICAgICB9ID0gcHJvcHM7XG5cbiAgICAgICAgY29uc3QgaW5pdGlhbHMgPSB1c2VNZW1vKCgpID0+IGdldEluaXRpYWxzRm9yTmFtZShuYW1lKSwgW25hbWVdKTtcbiAgICAgICAgY29uc3QgYXJpYUxhYmVsID0gZ2V0QXJpYUxhYmVsKHtcbiAgICAgICAgICAgIC4uLnByb3BzLFxuICAgICAgICAgICAgc3RhdHVzTGFiZWxzLFxuICAgICAgICB9KTtcblxuICAgICAgICBjb25zdCBleHRyYVZpZXdQcm9wID0gdHlwZSA9PT0gJ2JhZGdlJyA/IHsgYmFkZ2VWaWV3IH0gOiB7IGNvdW50ZXJWaWV3IH07XG5cbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICAgIDxSb290XG4gICAgICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgICAgICAgc2l6ZT17YXZhdGFyU2l6ZX1cbiAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2N4KGNsYXNzZXMuYXZhdGFySXRlbSwgY2xhc3NOYW1lKX1cbiAgICAgICAgICAgICAgICBhcmlhLWxhYmVsPXthcmlhTGFiZWx9XG4gICAgICAgICAgICAgICAgZm9jdXNlZD17Zm9jdXNlZH1cbiAgICAgICAgICAgICAgICB7Li4uZXh0cmFWaWV3UHJvcH1cbiAgICAgICAgICAgICAgICB7Li4ucmVzdH1cbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8V3JhcHBlciBpc1NjYWxhYmxlPXtpc1NjYWxhYmxlfT57Z2V0QXZhdGFyQ29udGVudCh7IGN1c3RvbVRleHQsIHVybCwgaW5pdGlhbHMsIG5hbWUgfSl9PC9XcmFwcGVyPlxuXG4gICAgICAgICAgICAgICAge3N0YXR1cyAmJiAoXG4gICAgICAgICAgICAgICAgICAgIDxTdGF0dXNJY29uPlxuICAgICAgICAgICAgICAgICAgICAgICAgPFN0eWxlZEluZGljYXRvciBhcmlhLWxhYmVsPXtzdGF0dXNMYWJlbHNbc3RhdHVzXX0gc3RhdHVzPXtzdGF0dXN9IC8+XG4gICAgICAgICAgICAgICAgICAgIDwvU3RhdHVzSWNvbj5cbiAgICAgICAgICAgICAgICApfVxuXG4gICAgICAgICAgICAgICAge2hhc0V4dHJhICYmIGF2YXRhclNpemUgIT09ICdmaXQnICYmIChcbiAgICAgICAgICAgICAgICAgICAgPEV4dHJhQ29udGVudCBjbGFzc05hbWU9e2V4dHJhUGxhY2VtZW50TWFwKGV4dHJhUGxhY2VtZW50KX0+XG4gICAgICAgICAgICAgICAgICAgICAgICB7dHlwZSA9PT0gJ2NvdW50ZXInID8gKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxFeHRyYUNvdW50ZXIgdmlldz17Y291bnRlclZpZXd9IGNvdW50PXtjb3VudCB8fCAxfSBtYXhDb3VudD17bWF4Q291bnR9IC8+XG4gICAgICAgICAgICAgICAgICAgICAgICApIDogKFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGF2YXRhclNpemUgIT09ICdzJyAmJiAoXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxFeHRyYUJhZGdlXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB2aWV3PXtiYWRnZVZpZXd9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB0ZXh0PXt0ZXh0fVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY3VzdG9tQ29sb3I9e2N1c3RvbUNvbG9yfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY3VzdG9tQmFja2dyb3VuZENvbG9yPXtjdXN0b21CYWNrZ3JvdW5kQ29sb3J9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBwaWxsZWQ9e3BpbGxlZH1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG1heFdpZHRoPVwiMTAwJVwiXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB7Li4uKGNvbnRlbnRMZWZ0ID8geyBjb250ZW50TGVmdCB9IDogeyBjb250ZW50UmlnaHQgfSl9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC8+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgKVxuICAgICAgICAgICAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgICAgICAgICAgPC9FeHRyYUNvbnRlbnQ+XG4gICAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIDwvUm9vdD5cbiAgICAgICAgKTtcbiAgICB9KTtcbn07XG5cbmV4cG9ydCBjb25zdCBhdmF0YXJDb25maWcgPSB7XG4gICAgbmFtZTogJ0F2YXRhcicsXG4gICAgdGFnOiAnZGl2JyxcbiAgICBsYXlvdXQ6IGF2YXRhclJvb3QsXG4gICAgYmFzZSxcbiAgICB2YXJpYXRpb25zOiB7XG4gICAgICAgIHNpemU6IHtcbiAgICAgICAgICAgIGNzczogdmlld0NTUyxcbiAgICAgICAgfSxcbiAgICAgICAgZm9jdXNlZDoge1xuICAgICAgICAgICAgY3NzOiBmb2N1c2VkQ1NTLFxuICAgICAgICB9LFxuICAgIH0sXG4gICAgZGVmYXVsdHM6IHtcbiAgICAgICAgc2l6ZTogJ20nLFxuICAgIH0sXG59O1xuIl19 */"));
 var avatarRoot = exports.avatarRoot = function avatarRoot(Root) {
   return /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var avatarSize = props.size,
@@ -83,6 +83,19 @@ var avatarRoot = exports.avatarRoot = function avatarRoot(Root) {
       isScalable = props.isScalable,
       _props$statusLabels = props.statusLabels,
       statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
+      hasExtra = props.hasExtra,
+      extraPlacement = props.extraPlacement,
+      type = props.type,
+      counterView = props.counterView,
+      count = props.count,
+      maxCount = props.maxCount,
+      badgeView = props.badgeView,
+      text = props.text,
+      customColor = props.customColor,
+      customBackgroundColor = props.customBackgroundColor,
+      contentLeft = props.contentLeft,
+      contentRight = props.contentRight,
+      pilled = props.pilled,
       rest = _objectWithoutProperties(props, _excluded);
     var initials = (0, _react.useMemo)(function () {
       return (0, _utils2.getInitialsForName)(name);
@@ -90,13 +103,18 @@ var avatarRoot = exports.avatarRoot = function avatarRoot(Root) {
     var ariaLabel = getAriaLabel(_objectSpread(_objectSpread({}, props), {}, {
       statusLabels: statusLabels
     }));
+    var extraViewProp = type === 'badge' ? {
+      badgeView: badgeView
+    } : {
+      counterView: counterView
+    };
     return /*#__PURE__*/_react["default"].createElement(Root, _extends({
       ref: ref,
       size: avatarSize,
       className: (0, _utils.cx)(_Avatar.classes.avatarItem, className),
       "aria-label": ariaLabel,
       focused: focused
-    }, rest), /*#__PURE__*/_react["default"].createElement(_Avatar2.Wrapper, {
+    }, extraViewProp, rest), /*#__PURE__*/_react["default"].createElement(_Avatar2.Wrapper, {
       isScalable: isScalable
     }, getAvatarContent({
       customText: customText,
@@ -106,7 +124,24 @@ var avatarRoot = exports.avatarRoot = function avatarRoot(Root) {
     })), status && /*#__PURE__*/_react["default"].createElement(_Avatar2.StatusIcon, null, /*#__PURE__*/_react["default"].createElement(StyledIndicator, {
       "aria-label": statusLabels[status],
       status: status
-    })));
+    })), hasExtra && avatarSize !== 'fit' && /*#__PURE__*/_react["default"].createElement(_Avatar2.ExtraContent, {
+      className: (0, _utils2.extraPlacementMap)(extraPlacement)
+    }, type === 'counter' ? /*#__PURE__*/_react["default"].createElement(_Avatar2.ExtraCounter, {
+      view: counterView,
+      count: count || 1,
+      maxCount: maxCount
+    }) : avatarSize !== 's' && /*#__PURE__*/_react["default"].createElement(_Avatar2.ExtraBadge, _extends({
+      view: badgeView,
+      text: text,
+      customColor: customColor,
+      customBackgroundColor: customBackgroundColor,
+      pilled: pilled,
+      maxWidth: "100%"
+    }, contentLeft ? {
+      contentLeft: contentLeft
+    } : {
+      contentRight: contentRight
+    }))));
   });
 };
 var avatarConfig = exports.avatarConfig = {