npm - @salutejs/plasma-new-hope - Versions diffs - 0.336.0-canary.2238.17818313113.0 → 0.336.0-dev.0 - Mend

@salutejs/plasma-new-hope 0.336.0-canary.2238.17818313113.0 → 0.336.0-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (59) hide show

package/es/components/Avatar/Avatar.js CHANGED Viewed

@@ -7,12 +7,13 @@ import { classes, tokens } from './Avatar.tokens.js';
 import { Wrapper, StatusIcon, ExtraContent, ExtraCounter, ExtraBadge, base, Text, Image } from './Avatar.styles.js';
 import { base as base$1 } from './variations/_size/base.js';
 import { base as base$2 } from './variations/_focused/base.js';
+import { base as base$3 } from './variations/_shape/base.js';
 import { extraPlacementMap } from './utils/index.js';
 import { getInitialsForName } from './utils/getInitialsForName.js';
 import { component, mergeConfig } from '../../engines/common.js';
 import { indicatorConfig } from '../Indicator/Indicator.js';
-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 _excluded = ["size", "name", "url", "customText", "status", "className", "focused", "isScalable", "shape", "statusLabels", "hasExtra", "extraPlacement", "type", "counterView", "count", "maxCount", "badgeView", "text", "customColor", "customBackgroundColor", "contentLeft", "contentRight", "pilled"];
 var StatusLabelsDefault = {
   active: 'Активен',
   inactive: 'Неактивен'
@@ -77,6 +78,7 @@ var avatarRoot = function avatarRoot(Root) {
       _props$focused = props.focused,
       focused = _props$focused === void 0 ? true : _props$focused,
       isScalable = props.isScalable,
+      shape = props.shape,
       _props$statusLabels = props.statusLabels,
       statusLabels = _props$statusLabels === void 0 ? StatusLabelsDefault : _props$statusLabels,
       hasExtra = props.hasExtra,
@@ -108,6 +110,7 @@ var avatarRoot = function avatarRoot(Root) {
     return /*#__PURE__*/React.createElement(Root, _extends({
       ref: ref,
       size: avatarSize,
+      shape: shape,
       className: cx(classes.avatarItem, className),
       "aria-label": ariaLabel,
       focused: focused
@@ -152,10 +155,14 @@ var avatarConfig = {
     },
     focused: {
       css: base$2
+    },
+    shape: {
+      css: base$3
     }
   },
   defaults: {
-    size: 'm'
+    size: 'm',
+    shape: 'circled'
   }
 };

package/es/components/Avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +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, 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 counterValue = count \|\| 1;\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={counterValue} 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","counterValue","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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"}
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, ExtraContent, ExtraCounter, ExtraBadge } from './Avatar.styles';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as focusedCSS } from './variations/_focused/base';\nimport { base as shapeCSS } from './variations/_shape/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 shape,\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 counterValue = count \|\| 1;\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 shape={shape}\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={counterValue} 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: sizeCSS,\n },\n focused: {\n css: focusedCSS,\n },\n shape: {\n css: shapeCSS,\n },\n },\n defaults: {\n size: 'm',\n shape: 'circled',\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","shape","_props$statusLabels","hasExtra","extraPlacement","type","counterView","count","maxCount","badgeView","text","customColor","customBackgroundColor","contentLeft","contentRight","pilled","rest","_excluded","counterValue","useMemo","getInitialsForName","_objectSpread","extraViewProp","_extends","cx","classes","avatarItem","Wrapper","StatusIcon","ExtraContent","extraPlacementMap","ExtraCounter","view","ExtraBadge","maxWidth","avatarConfig","tag","layout","base","variations","css","sizeCSS","focusedCSS","shapeCSS","defaults"],"mappings":"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"}

package/es/components/Avatar/Avatar.styles.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import './Avatar.styles_131qvfx.css';
+import './Avatar.styles_1kvh8pj.css';
 import { styled } from '@linaria/react';
 import { tokens } from './Avatar.tokens.js';
 import { component, mergeConfig } from '../../engines/common.js';
@@ -51,18 +51,18 @@ var ExtraContent = /*#__PURE__*/styled('div')({
   "class": "e1i3umn2",
   propsAsIs: false
 });
-var _exp26 = function _exp26() {
+var _exp22 = function _exp22() {
   return Badge;
 };
-var ExtraBadge = /*#__PURE__*/styled(_exp26())({
+var ExtraBadge = /*#__PURE__*/styled(_exp22())({
   name: "ExtraBadge",
   "class": "eqy70yy",
   propsAsIs: true
 });
-var _exp69 = function _exp69() {
+var _exp65 = function _exp65() {
   return Counter;
 };
-var ExtraCounter = /*#__PURE__*/styled(_exp69())({
+var ExtraCounter = /*#__PURE__*/styled(_exp65())({
   name: "ExtraCounter",
   "class": "e4nvvok",
   propsAsIs: true

package/es/components/Avatar/Avatar.styles.js.map CHANGED Viewed

	@@ -1 +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 { 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":";;;;;;AAUA,IAAMA,iBAAiB,gBAAGC,WAAW,CAACC,WAAW,CAAC,CAAA;AAClD,IAAMC,KAAK,gBAAGC,SAAS,CAACJ,iBAAiB,CAAC,CAAA;AAE1C,IAAMK,mBAAmB,gBAAGJ,WAAW,CAACK,aAAa,CAAC,CAAA;AACtD,IAAMC,OAAO,gBAAGH,SAAS,CAACC,mBAAmB,CAAC,CAAA;AAEvC,IAAMG,IAAI,GAEhB,WAAA;AAAC,IAAAC,KAAA,GAjBgBA,SAiBhBA,KAAAA,GAAA;AAAA,EAAA,~~OAae~~,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,UAAAA,GAAAA,IAAAA,CAAAA,UAAAA,CAAAA;IAAAA,OAAkBA,UAAU,UAAAC,MAAA,CAAUC,MAAM,CAACC,UAAU,SAAM,GAAI,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,~~GA9BnEA~~,~~SA8BmEA~~,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,MAAM,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,MAAM,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,MAAM,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,MAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,MAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUzB,EAAA;AAEM,IAAMK,YAAY,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA0BjC,EAAA;AAAC,IAAAM,MAAA,~~GArFgBA~~,~~SAqFhBA~~,MAAAA,GAAA;AAAA,EAAA,OAE+BxB,KAAK,CAAA;AAAA,CAAA,CAAA;AAA/B,IAAMyB,UAAU,gBAAGV,MAAM,CAAAS,MAAA,EAAA,CAAA,CAAA;AAAAR,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAsB/B,EAAA;AAAC,IAAAQ,MAAA,~~GA7GgBA~~,~~SA6GhBA~~,MAAAA,GAAA;AAAA,EAAA,OAEiCtB,OAAO,CAAA;AAAA,CAAA,CAAA;AAAnC,IAAMuB,YAAY,gBAAGZ,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAYjC;;;;"}
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 { 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 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`;\n\nexport const Image = styled.img`\n width: 100%;\n height: 100%;\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","_exp22","ExtraBadge","_exp65","ExtraCounter"],"mappings":";;;;;;AAUA,IAAMA,iBAAiB,gBAAGC,WAAW,CAACC,WAAW,CAAC,CAAA;AAClD,IAAMC,KAAK,gBAAGC,SAAS,CAACJ,iBAAiB,CAAC,CAAA;AAE1C,IAAMK,mBAAmB,gBAAGJ,WAAW,CAACK,aAAa,CAAC,CAAA;AACtD,IAAMC,OAAO,gBAAGH,SAAS,CAACC,mBAAmB,CAAC,CAAA;AAEvC,IAAMG,IAAI,GAEhB,WAAA;AAAC,IAAAC,KAAA,GAjBgBA,SAiBhBA,KAAAA,GAAA;AAAA,EAAA,OAYe,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,UAAAA,GAAAA,IAAAA,CAAAA,UAAAA,CAAAA;IAAAA,OAAkBA,UAAU,UAAAC,MAAA,CAAUC,MAAM,CAACC,UAAU,SAAM,GAAI,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAC,KAAA,GA7BnEA,SA6BmEA,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;AAXnE,IAAMM,OAAO,gBAAGC,MAAM,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,cAUZb,KAAoE,EAAA,CAAA;AAAA,IAAA,WAAA,EAAA,cACnEM,KAAwD,EAAA,CAAA;AAAA,GAAA;AAAA,CAEzE,EAAA;AAEM,IAAMQ,UAAU,gBAAGL,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAE/B,EAAA;AAEM,IAAMG,KAAK,gBAAGN,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,OAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAG1B,EAAA;AAEM,IAAMI,IAAI,gBAAGP,MAAM,CAAA,MAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,MAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAUzB,EAAA;AAEM,IAAMK,YAAY,gBAAGR,MAAM,CAAA,KAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA0BjC,EAAA;AAAC,IAAAM,MAAA,GAjFgBA,SAiFhBA,MAAAA,GAAA;AAAA,EAAA,OAE+BxB,KAAK,CAAA;AAAA,CAAA,CAAA;AAA/B,IAAMyB,UAAU,gBAAGV,MAAM,CAAAS,MAAA,EAAA,CAAA,CAAA;AAAAR,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAsB/B,EAAA;AAAC,IAAAQ,MAAA,GAzGgBA,SAyGhBA,MAAAA,GAAA;AAAA,EAAA,OAEiCtB,OAAO,CAAA;AAAA,CAAA,CAAA;AAAnC,IAAMuB,YAAY,gBAAGZ,MAAM,CAAAW,MAAA,EAAA,CAAA,CAAA;AAAAV,EAAAA,IAAA,EAAA,cAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAYjC;;;;"}

package/es/components/Avatar/{Avatar.styles_131qvfx.css → Avatar.styles_1kvh8pj.css} RENAMED Viewed

@@ -1,7 +1,7 @@
 .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%;}
+.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%;background:var(--plasma-avatar-background);overflow:hidden;}.wxwn3we:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
+.sf2jhi1{position:absolute;}
+.igq6ihg{width:100%;height:100%;}
 .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);}

package/es/components/Avatar/Avatar.tokens.js CHANGED Viewed

@@ -21,6 +21,9 @@ var tokens = {
   outlineOffset: '--plasma-avatar-outline-offset',
   scaleHover: '--plasma-avatar-scale-hover',
   extraPlacementFactor: '--plasma-avatar-extra-placement-factor',
+  borderRadius: '--plasma-avatar-border-radius',
+  statusLeft: '--plasma-avatar-status-left',
+  statusTop: '--plasma-avatar-status-top',
   // extra badge tokens
   badgeBackground: '--plasma-avatar-extra-badge-background',
   badgeColor: '--plasma-avatar-extra-badge-color',

package/es/components/Avatar/Avatar.tokens.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"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;;;;"}
1	+ {"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 borderRadius: '--plasma-avatar-border-radius',\n statusLeft: '--plasma-avatar-status-left',\n statusTop: '--plasma-avatar-status-top',\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","borderRadius","statusLeft","statusTop","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;AAC9DC,EAAAA,YAAY,EAAE,+BAA+B;AAC7CC,EAAAA,UAAU,EAAE,6BAA6B;AACzCC,EAAAA,SAAS,EAAE,4BAA4B;AAEvC;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/es/components/Avatar/variations/_shape/base.js ADDED Viewed

@@ -0,0 +1,5 @@
+import './base_1qwucc7.css';
+var base = "be2qour";
+export { base };
+//# sourceMappingURL=base.js.map

package/es/components/Avatar/variations/_shape/base.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"base.js","sources":["../../../../../src/components/Avatar/variations/_shape/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../Avatar.tokens';\nimport { Image, Wrapper, StatusIcon } from '../../Avatar.styles';\n\nexport const base = css`\n ${Image} {\n border-radius: var(${tokens.borderRadius});\n }\n ${Wrapper} {\n border-radius: var(${tokens.borderRadius});\n }\n\n ${StatusIcon} {\n top: var(${tokens.statusTop});\n left: var(${tokens.statusLeft});\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAYhB;;;;"}

package/es/components/Avatar/variations/_shape/base_1qwucc7.css ADDED Viewed

	@@ -0,0 +1 @@
1	+ .be2qour .igq6ihg{border-radius:var(--plasma-avatar-border-radius);}.be2qour .wxwn3we{border-radius:var(--plasma-avatar-border-radius);}.be2qour .sf2jhi1{top:var(--plasma-avatar-status-top);left:var(--plasma-avatar-status-left);}

package/es/index.css CHANGED Viewed

@@ -538,19 +538,21 @@
 .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_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);}
+.Avatar_styles_1kvh8pj_b1d1rtx8__0cd12c59{position:relative;}
+.Avatar_styles_1kvh8pj_wxwn3we__0cd12c59{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%;background:var(--plasma-avatar-background);overflow:hidden;}.Avatar_styles_1kvh8pj_wxwn3we__0cd12c59:hover{scale:var(--wxwn3we-0);cursor:var(--wxwn3we-1);}
+.Avatar_styles_1kvh8pj_sf2jhi1__0cd12c59{position:absolute;}
+.Avatar_styles_1kvh8pj_igq6ihg__0cd12c59{width:100%;height:100%;}
+.Avatar_styles_1kvh8pj_t1kfsxcq__0cd12c59{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_1kvh8pj_e1i3umn2__0cd12c59{max-width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;z-index:2;}.Avatar_styles_1kvh8pj_e1i3umn2__0cd12c59.Avatar_styles_1kvh8pj_avatarExtraPlacementTopLeft__0cd12c59{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_1kvh8pj_e1i3umn2__0cd12c59.Avatar_styles_1kvh8pj_avatarExtraPlacementTopRight__0cd12c59{top:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_1kvh8pj_e1i3umn2__0cd12c59.Avatar_styles_1kvh8pj_avatarExtraPlacementBottomRight__0cd12c59{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));right:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}.Avatar_styles_1kvh8pj_e1i3umn2__0cd12c59.Avatar_styles_1kvh8pj_avatarExtraPlacementBottomLeft__0cd12c59{bottom:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));left:calc(-0.063rem * var(--plasma-avatar-extra-placement-factor,0));}
+.Avatar_styles_1kvh8pj_eqy70yy__0cd12c59{--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_1kvh8pj_e4nvvok__0cd12c59{--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);}
 .base_a6i4i9_boftdhc__c8d1b637{position:relative;}.base_a6i4i9_boftdhc__c8d1b637:focus-visible{outline:none;}.base_a6i4i9_boftdhc__c8d1b637::before{content:'';position:absolute;top:var(--plasma-avatar-outline-offset);left:var(--plasma-avatar-outline-offset);right:var(--plasma-avatar-outline-offset);bottom:var(--plasma-avatar-outline-offset);z-index:1;display:block;box-sizing:content-box;border:var(--plasma-avatar-outline-size) solid transparent;border-radius:100%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.base_a6i4i9_boftdhc__c8d1b637.base_a6i4i9_focusVisible__c8d1b637:focus::before,.base_a6i4i9_boftdhc__c8d1b637[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 var(--plasma-avatar-outline-size) var(--plasma-avatar-outline-color);}
+.base_1qwucc7_be2qour__d1f6e07e .base_1qwucc7_igq6ihg__d1f6e07e{border-radius:var(--plasma-avatar-border-radius);}.base_1qwucc7_be2qour__d1f6e07e .base_1qwucc7_wxwn3we__d1f6e07e{border-radius:var(--plasma-avatar-border-radius);}.base_1qwucc7_be2qour__d1f6e07e .base_1qwucc7_sf2jhi1__d1f6e07e{top:var(--plasma-avatar-status-top);left:var(--plasma-avatar-status-left);}
 .Avatar_13f2qzh_sgw0czr__a18675b6{--plasma-indicator-size:var(--plasma-status-icon-size);--plasma-indicator-color:var(--sgw0czr-0);}
 .AvatarGroup_styles_rsmybl_bxtue4e__126d9711{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711{margin-left:calc(var(--plasma-avatar-size) * -0.2);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * 1.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * 1.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:first-child{margin-left:0;}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:last-child{-webkit-mask-image:none;}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:hover,.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:focus-visible{position:relative;-webkit-mask:none;mask:none;cursor:pointer;}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:hover + .AvatarGroup_styles_rsmybl_avatarItem__126d9711,.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:focus-visible + .AvatarGroup_styles_rsmybl_avatarItem__126d9711{-webkit-mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * 1.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 ), radial-gradient( circle at calc(var(--plasma-avatar-size) * -0.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * 1.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 ), radial-gradient( circle at calc(var(--plasma-avatar-size) * -0.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );-webkit-mask-composite:intersect;mask-composite:intersect;}.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:hover + .AvatarGroup_styles_rsmybl_avatarItem__126d9711:last-child,.AvatarGroup_styles_rsmybl_bxtue4e__126d9711 .AvatarGroup_styles_rsmybl_avatarItem__126d9711:focus-visible + .AvatarGroup_styles_rsmybl_avatarItem__126d9711:last-child{-webkit-mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * -0.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );mask:radial-gradient( circle at calc(var(--plasma-avatar-size) * -0.3) center, #0000 calc(var(--plasma-avatar-size) * 0.58), #000 0 );}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.336.0-canary.2238.17818313113.0",
+  "version": "0.336.0-dev.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -79,8 +79,8 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-node-resolve": "^15.1.0",
-    "@salutejs/plasma-sb-utils": "0.208.0-canary.2238.17818313113.0",
-    "@salutejs/plasma-themes": "0.38.0-canary.2238.17818313113.0",
+    "@salutejs/plasma-sb-utils": "0.208.0-dev.0",
+    "@salutejs/plasma-themes": "0.38.0-dev.0",
     "@storybook/addon-docs": "8.6.12",
     "@storybook/addon-essentials": "8.6.12",
     "@storybook/manager-api": "8.6.12",
@@ -117,7 +117,7 @@
     "@linaria/react": "5.0.3",
     "@popperjs/core": "2.11.8",
     "@salutejs/input-core": "2.1.2",
-    "@salutejs/plasma-core": "1.208.0-canary.2238.17818313113.0",
+    "@salutejs/plasma-core": "1.208.0-dev.0",
     "@salutejs/react-maskinput": "3.2.6",
     "@tanstack/react-table": "8.21.2",
     "@tanstack/react-virtual": "3.13.2",
@@ -137,5 +137,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "f4fda681a00ca61546075c6031157f9077c9c438"
+  "gitHead": "0970b1354a662c44c6ba728d7d5a7c34b4a1f00a"
 }

package/styled-components/cjs/components/Avatar/Avatar.js CHANGED Viewed

@@ -25,6 +25,7 @@ var _Avatartokens = require("./Avatar.tokens");
 var _Avatarstyles = require("./Avatar.styles");
 var _base = require("./variations/_size/base");
 var _base1 = require("./variations/_focused/base");
+var _base2 = require("./variations/_shape/base");
 var _utils1 = require("./utils");
 function _define_property(obj, key, value) {
     if (key in obj) {
@@ -181,7 +182,7 @@ var mergedConfig = (0, _engines.mergeConfig)(_Indicator.indicatorConfig);
 var Indicator = (0, _engines.component)(mergedConfig);
 var StyledIndicator = (0, _styledcomponents.default)(Indicator).withConfig({
     displayName: "Avatar__StyledIndicator",
-    componentId: "sc-7036ad13-0"
+    componentId: "sc-76e2f30f-0"
 })([
     "",
     ":var(",
@@ -194,7 +195,7 @@ var StyledIndicator = (0, _styledcomponents.default)(Indicator).withConfig({
 });
 var avatarRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(props, ref) {
-        var avatarSize = props.size, name = props.name, url = props.url, customText = props.customText, status = props.status, className = props.className, _props_focused = props.focused, focused = _props_focused === void 0 ? true : _props_focused, 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 = _object_without_properties(props, [
+        var avatarSize = props.size, name = props.name, url = props.url, customText = props.customText, status = props.status, className = props.className, _props_focused = props.focused, focused = _props_focused === void 0 ? true : _props_focused, isScalable = props.isScalable, shape = props.shape, _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 = _object_without_properties(props, [
             "size",
             "name",
             "url",
@@ -203,6 +204,7 @@ var avatarRoot = function(Root) {
             "className",
             "focused",
             "isScalable",
+            "shape",
             "statusLabels",
             "hasExtra",
             "extraPlacement",
@@ -235,6 +237,7 @@ var avatarRoot = function(Root) {
         return /*#__PURE__*/ _react.default.createElement(Root, _object_spread({
             ref: ref,
             size: avatarSize,
+            shape: shape,
             className: (0, _utils.cx)(_Avatartokens.classes.avatarItem, className),
             "aria-label": ariaLabel,
             focused: focused
@@ -279,9 +282,13 @@ var avatarConfig = {
         },
         focused: {
             css: _base1.base
+        },
+        shape: {
+            css: _base2.base
         }
     },
     defaults: {
-        size: 'm'
+        size: 'm',
+        shape: 'circled'
     }
 };

package/styled-components/cjs/components/Avatar/Avatar.styles.js CHANGED Viewed

@@ -89,9 +89,9 @@ var base = (0, _styledcomponents.css)([
 ]);
 var Wrapper = _styledcomponents.default.div.withConfig({
     displayName: "Avatar.styles__Wrapper",
-    componentId: "sc-5ac342c-0"
+    componentId: "sc-86d30134-0"
 })([
-    "display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:50%;background:var(",
+    "display:flex;justify-content:center;align-items:center;width:100%;height:100%;background:var(",
     ");overflow:hidden;&:hover{scale:",
     ";cursor:",
     ";}"
@@ -104,23 +104,19 @@ var Wrapper = _styledcomponents.default.div.withConfig({
 });
 var StatusIcon = _styledcomponents.default.div.withConfig({
     displayName: "Avatar.styles__StatusIcon",
-    componentId: "sc-5ac342c-1"
+    componentId: "sc-86d30134-1"
 })([
-    "position:absolute;top:calc(1.02 * 0.85 * var(",
-    ") - var(",
-    ") / 2);left:calc(1.02 * 0.85 * var(",
-    ") - var(",
-    ") / 2);"
-], _Avatartokens.tokens.avatarSize, _Avatartokens.tokens.statusIconSize, _Avatartokens.tokens.avatarSize, _Avatartokens.tokens.statusIconSize);
+    "position:absolute;"
+]);
 var Image = _styledcomponents.default.img.withConfig({
     displayName: "Avatar.styles__Image",
-    componentId: "sc-5ac342c-2"
+    componentId: "sc-86d30134-2"
 })([
-    "width:100%;height:100%;border-radius:50%;"
+    "width:100%;height:100%;"
 ]);
 var Text = _styledcomponents.default.span.withConfig({
     displayName: "Avatar.styles__Text",
-    componentId: "sc-5ac342c-3"
+    componentId: "sc-86d30134-3"
 })([
     "font-size:var(",
     ");font-family:var(",
@@ -132,7 +128,7 @@ var Text = _styledcomponents.default.span.withConfig({
 ], _Avatartokens.tokens.fontSize, _Avatartokens.tokens.fontFamily, _Avatartokens.tokens.fontWeight, _Avatartokens.tokens.lineHeight, _Avatartokens.tokens.color, _Avatartokens.tokens.color);
 var ExtraContent = _styledcomponents.default.div.withConfig({
     displayName: "Avatar.styles__ExtraContent",
-    componentId: "sc-5ac342c-4"
+    componentId: "sc-86d30134-4"
 })([
     "max-width:100%;display:flex;position:absolute;z-index:2;&.",
     "{top:calc(-0.063rem * var(",
@@ -150,7 +146,7 @@ var ExtraContent = _styledcomponents.default.div.withConfig({
 ], _Avatartokens.classes.extraPlacementTopLeft, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.classes.extraPlacementTopRight, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.classes.extraPlacementBottomRight, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.classes.extraPlacementBottomLeft, _Avatartokens.tokens.extraPlacementFactor, _Avatartokens.tokens.extraPlacementFactor);
 var ExtraBadge = (0, _styledcomponents.default)(Badge).withConfig({
     displayName: "Avatar.styles__ExtraBadge",
-    componentId: "sc-5ac342c-5"
+    componentId: "sc-86d30134-5"
 })([
     "",
     ":var(",
@@ -198,7 +194,7 @@ var ExtraBadge = (0, _styledcomponents.default)(Badge).withConfig({
 ], _Badge.badgeTokens.background, _Avatartokens.tokens.badgeBackground, _Badge.badgeTokens.color, _Avatartokens.tokens.badgeColor, _Badge.badgeTokens.backgroundTransparent, _Avatartokens.tokens.badgeBackgroundTransparent, _Badge.badgeTokens.colorTransparent, _Avatartokens.tokens.badgeColorTransparent, _Badge.badgeTokens.colorClear, _Avatartokens.tokens.badgeColorClear, _Badge.badgeTokens.backgroundClear, _Avatartokens.tokens.badgeBackgroundClear, _Badge.badgeTokens.borderRadius, _Avatartokens.tokens.badgeBorderRadius, _Badge.badgeTokens.pilledBorderRadius, _Avatartokens.tokens.badgePilledBorderRadius, _Badge.badgeTokens.height, _Avatartokens.tokens.badgeHeight, _Badge.badgeTokens.padding, _Avatartokens.tokens.badgePadding, _Badge.badgeTokens.paddingIconOnly, _Avatartokens.tokens.badgePaddingIconOnly, _Badge.badgeTokens.fontFamily, _Avatartokens.tokens.badgeFontFamily, _Badge.badgeTokens.fontSize, _Avatartokens.tokens.badgeFontSize, _Badge.badgeTokens.fontStyle, _Avatartokens.tokens.badgeFontStyle, _Badge.badgeTokens.fontWeight, _Avatartokens.tokens.badgeFontWeight, _Badge.badgeTokens.letterSpacing, _Avatartokens.tokens.badgeLetterSpacing, _Badge.badgeTokens.lineHeight, _Avatartokens.tokens.badgeLineHeight, _Badge.badgeTokens.leftContentMarginLeft, _Avatartokens.tokens.badgeLeftContentMarginLeft, _Badge.badgeTokens.leftContentMarginRight, _Avatartokens.tokens.badgeLeftContentMarginRight, _Badge.badgeTokens.rightContentMarginLeft, _Avatartokens.tokens.badgeRightContentMarginLeft, _Badge.badgeTokens.rightContentMarginRight, _Avatartokens.tokens.badgeRightContentMarginRight);
 var ExtraCounter = (0, _styledcomponents.default)(Counter).withConfig({
     displayName: "Avatar.styles__ExtraCounter",
-    componentId: "sc-5ac342c-6"
+    componentId: "sc-86d30134-6"
 })([
     "",
     ":var(",

package/styled-components/cjs/components/Avatar/Avatar.tokens.js CHANGED Viewed

@@ -39,6 +39,9 @@ var tokens = {
     outlineOffset: '--plasma-avatar-outline-offset',
     scaleHover: '--plasma-avatar-scale-hover',
     extraPlacementFactor: '--plasma-avatar-extra-placement-factor',
+    borderRadius: '--plasma-avatar-border-radius',
+    statusLeft: '--plasma-avatar-status-left',
+    statusTop: '--plasma-avatar-status-top',
     // extra badge tokens
     badgeBackground: '--plasma-avatar-extra-badge-background',
     badgeColor: '--plasma-avatar-extra-badge-color',

package/styled-components/cjs/components/Avatar/variations/_shape/base.js ADDED Viewed

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "base", {
+    enumerable: true,
+    get: function() {
+        return base;
+    }
+});
+var _styledcomponents = require("styled-components");
+var _Avatartokens = require("../../Avatar.tokens");
+var _Avatarstyles = require("../../Avatar.styles");
+var base = (0, _styledcomponents.css)([
+    "",
+    "{border-radius:var(",
+    ");}",
+    "{border-radius:var(",
+    ");}",
+    "{top:var(",
+    ");left:var(",
+    ");}"
+], _Avatarstyles.Image, _Avatartokens.tokens.borderRadius, _Avatarstyles.Wrapper, _Avatartokens.tokens.borderRadius, _Avatarstyles.StatusIcon, _Avatartokens.tokens.statusTop, _Avatartokens.tokens.statusLeft);