@toptal/picasso 13.0.0 → 13.2.1

package/Avatar/Avatar.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent, HTMLAttributes } from 'react';
+import React, { FunctionComponent, HTMLAttributes } from 'react';
 import { StandardProps, SizeType } from '@toptal/picasso-shared';
 export declare type VariantType = 'square' | 'portrait' | 'landscape';
 export declare type AvatarSizeType = SizeType<'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large'>;
@@ -7,18 +7,27 @@ export interface Props extends StandardProps, HTMLAttributes<HTMLDivElement> {
     alt?: string;
     /** User full name to display initials on the avatar */
     name?: string;
-    /**
-     * Size
-     * @default xsmall
-     */
+    /** Size */
     size?: AvatarSizeType;
     /** Photo url */
     src?: string;
-    /**
-     * Variant of the avatar shape
-     * @default square
-     */
+    /** Variant of the avatar shape */
     variant?: VariantType;
+    testIds?: {
+        wrapper?: string;
+        icon?: string;
+        image?: string;
+        text?: string;
+    };
 }
 export declare const Avatar: FunctionComponent<Props>;
-export default Avatar;
+declare const _default: React.FunctionComponent<Props> & {
+    Group: {
+        ({ className, style, testIds, items, limit, size }: import("./AvatarGroup/AvatarGroup").Props): JSX.Element | null;
+        defaultProps: {
+            limit: number;
+            size: string;
+        };
+    };
+};
+export default _default;

package/Avatar/Avatar.js

@@ -9,32 +9,57 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React from 'react';
-import cx from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
-import styles from './styles';
-import ImageAvatar from './ImageAvatar';
-import InitialsAvatar from './InitialsAvatar';
-import IconAvatar from './IconAvatar';
-const useStyles = makeStyles(styles, { name: 'PicassoAvatar' });
-export const Avatar = props => {
-    const { alt, src, className, name, size = 'xsmall', style, variant = 'square' } = props, rest = __rest(props, ["alt", "src", "className", "name", "size", "style", "variant"]);
-    const classes = useStyles(props);
-    const renderAvatar = () => {
+import React, { useCallback } from 'react';
+import { AVATAR_INITIALS_LIMIT } from '../utils/constants';
+import getNameInitials from '../utils/get-name-initials';
+import ImageAvatar from './ImageAvatar/ImageAvatar';
+import TextAvatar from './TextAvatar/TextAvatar';
+import IconAvatar from './IconAvatar/IconAvatar';
+import AvatarGroup from './AvatarGroup/AvatarGroup';
+import AvatarWrapper from './AvatarWrapper/AvatarWrapper';
+export const Avatar = (_a) => {
+    var { alt, src, className, name, size, style, variant, testIds } = _a, rest = __rest(_a, ["alt", "src", "className", "name", "size", "style", "variant", "testIds"]);
+    const renderAvatar = useCallback(() => {
         if (src) {
-            return (React.createElement(ImageAvatar, { alt: alt, classes: classes, className: className, name: name, size: size, src: src, style: style, variant: variant }));
+            return (React.createElement(ImageAvatar, { alt: alt, className: className, name: name, 
+                /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+                size: size, src: src, style: style, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.image }));
         }
         if (name) {
-            return (React.createElement(InitialsAvatar, { classes: classes, className: className, name: name, size: size, variant: variant }));
+            const initials = getNameInitials(name);
+            const isLongText = initials.length >= AVATAR_INITIALS_LIMIT;
+            return (React.createElement(TextAvatar, { className: className, fontSize: isLongText ? 'small' : 'large', 
+                /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+                size: size, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.text }, initials));
         }
-        return (React.createElement(IconAvatar, { classes: classes, className: className, size: size, variant: variant }));
-    };
-    return (React.createElement("div", Object.assign({}, rest, { className: cx(classes.root, classes[size]) }), renderAvatar()));
+        return (React.createElement(IconAvatar, { "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.icon, className: className, 
+            /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+            size: size }));
+    }, [
+        size,
+        alt,
+        className,
+        src,
+        testIds === null || testIds === void 0 ? void 0 : testIds.icon,
+        testIds === null || testIds === void 0 ? void 0 : testIds.image,
+        testIds === null || testIds === void 0 ? void 0 : testIds.text,
+        name,
+        style
+    ]);
+    return (React.createElement(AvatarWrapper
+    /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+    , Object.assign({ 
+        /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+        variant: variant, 
+        /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+        size: size, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.wrapper }, rest), renderAvatar()));
 };
 Avatar.defaultProps = {
     size: 'xsmall',
     variant: 'square'
 };
 Avatar.displayName = 'Avatar';
-export default Avatar;
+export default Object.assign(Avatar, {
+    Group: AvatarGroup
+});
 //# sourceMappingURL=Avatar.js.map

package/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAA4C,MAAM,OAAO,CAAA;AAChE,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAG5D,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,WAAW,MAAM,eAAe,CAAA;AACvC,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AA0BrC,MAAM,SAAS,GAAG,UAAU,CAAe,MAAM,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,CAAA;AAE7E,MAAM,CAAC,MAAM,MAAM,GAA6B,KAAK,CAAC,EAAE;IACtD,MAAM,EACJ,GAAG,EACH,GAAG,EACH,SAAS,EACT,IAAI,EACJ,IAAI,GAAG,QAAQ,EACf,KAAK,EACL,OAAO,GAAG,QAAQ,KAEhB,KAAK,EADJ,IAAI,UACL,KAAK,EATH,+DASL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAEhC,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,GAAG,EAAE;YACP,OAAO,CACL,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;SACF;QAED,IAAI,IAAI,EAAE;YACR,OAAO,CACL,oBAAC,cAAc,IACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;SACF;QAED,OAAO,CACL,oBAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;IACH,CAAC,CAAA;IAED,OAAO,CACL,6CAAS,IAAI,IAAE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC,KACtD,YAAY,EAAE,CACX,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,YAAY,GAAG;IACpB,IAAI,EAAE,QAAQ;IACd,OAAO,EAAE,QAAQ;CAClB,CAAA;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAA;AAE7B,eAAe,MAAM,CAAA"}
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAqC,WAAW,EAAE,MAAM,OAAO,CAAA;AAG7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAC1D,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,WAAW,MAAM,2BAA2B,CAAA;AACnD,OAAO,UAAU,MAAM,yBAAyB,CAAA;AAChD,OAAO,UAAU,MAAM,yBAAyB,CAAA;AAChD,OAAO,WAAW,MAAM,2BAA2B,CAAA;AACnD,OAAO,aAAa,MAAM,+BAA+B,CAAA;AA0BzD,MAAM,CAAC,MAAM,MAAM,GAA6B,CAAC,EAUhD,EAAE,EAAE;QAV4C,EAC/C,GAAG,EACH,GAAG,EACH,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,OAAO,EACP,OAAO,OAER,EADI,IAAI,cATwC,0EAUhD,CADQ;IAEP,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,IAAI,GAAG,EAAE;YACP,OAAO,CACL,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI;gBACV,uEAAuE;gBACvE,IAAI,EAAE,IAAK,EACX,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,iBACC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,GAC3B,CACH,CAAA;SACF;QAED,IAAI,IAAI,EAAE;YACR,MAAM,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,CAAA;YACtC,MAAM,UAAU,GAAG,QAAQ,CAAC,MAAM,IAAI,qBAAqB,CAAA;YAE3D,OAAO,CACL,oBAAC,UAAU,IACT,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;gBACxC,uEAAuE;gBACvE,IAAI,EAAE,IAAK,iBACE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,IAEzB,QAAQ,CACE,CACd,CAAA;SACF;QAED,OAAO,CACL,oBAAC,UAAU,mBACI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,EAC1B,SAAS,EAAE,SAAS;YACpB,uEAAuE;YACvE,IAAI,EAAE,IAAK,GACX,CACH,CAAA;IACH,CAAC,EAAE;QACD,IAAI;QACJ,GAAG;QACH,SAAS;QACT,GAAG;QACH,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI;QACb,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK;QACd,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI;QACb,IAAI;QACJ,KAAK;KACN,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,aAAa;IACZ,uEAAuE;;QAAvE,uEAAuE;QACvE,OAAO,EAAE,OAAQ;QACjB,uEAAuE;QACvE,IAAI,EAAE,IAAK,iBACE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,IACzB,IAAI,GAEP,YAAY,EAAE,CACD,CACjB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,YAAY,GAAG;IACpB,IAAI,EAAE,QAAQ;IACd,OAAO,EAAE,QAAQ;CAClB,CAAA;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAA;AAE7B,eAAe,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE;IACnC,KAAK,EAAE,WAAW;CACnB,CAAC,CAAA"}

package/Avatar/AvatarGroup/AvatarGroup.d.ts

@@ -0,0 +1,29 @@
+import { BaseProps } from '@toptal/picasso-shared';
+import { AvatarSizeType } from '../Avatar';
+declare type ItemType = {
+    alt?: string;
+    'data-testid'?: string;
+    name?: string;
+    src?: string;
+};
+export interface Props extends Omit<BaseProps, 'data-testid'> {
+    /** Array of people to render */
+    items: ItemType[];
+    /** Limit how many avatars can be rendered */
+    limit?: number;
+    /** Size */
+    size?: AvatarSizeType;
+    /** data-testid to all parts of component */
+    testIds?: {
+        container?: string;
+        overLimit?: string;
+    };
+}
+declare const AvatarGroup: {
+    ({ className, style, testIds, items, limit, size }: Props): JSX.Element | null;
+    defaultProps: {
+        limit: number;
+        size: string;
+    };
+};
+export default AvatarGroup;

package/Avatar/AvatarGroup/AvatarGroup.js

@@ -0,0 +1,41 @@
+import React, { useMemo } from 'react';
+import cx from 'classnames';
+import { makeStyles } from '@material-ui/core/styles';
+import { Container } from '../..';
+import Avatar from '../Avatar';
+import AvatarWrapper from '../AvatarWrapper/AvatarWrapper';
+import TextAvatar from '../TextAvatar/TextAvatar';
+import styles from './styles';
+const useStyles = makeStyles(styles, {
+    name: 'PicassoAvatarGroup'
+});
+const AvatarGroup = ({ className, style, testIds, items, limit, size }) => {
+    const classes = useStyles();
+    /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+    const isOverLimit = items.length > limit;
+    // we need to add +1 for the last item that is going to be transformed to numbered Avatar
+    /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+    const itemsOverLimit = items.length - limit + 1;
+    const avatarsToRender = useMemo(() => 
+    /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+    isOverLimit ? items.slice(0, limit - 1) : items, [isOverLimit, items, limit]);
+    if (items.length === 0) {
+        return null;
+    }
+    return (React.createElement(Container, { className: cx(classes.root, className), "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.container, flex: true, gap: 'xsmall', style: style },
+        avatarsToRender.map(({ alt, name, src, 'data-testid': avatarTestId }, index) => (React.createElement(Avatar, { alt: alt, key: `${name}-${alt}-${String(index)}`, name: name, 
+            /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+            size: size, src: src, "data-testid": avatarTestId }))),
+        isOverLimit ? (
+        /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+        React.createElement(AvatarWrapper, { size: size, variant: 'square' },
+            React.createElement(TextAvatar, { "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.overLimit, size: size },
+                "+",
+                itemsOverLimit))) : null));
+};
+AvatarGroup.defaultProps = {
+    limit: 5,
+    size: 'xsmall'
+};
+export default AvatarGroup;
+//# sourceMappingURL=AvatarGroup.js.map

package/Avatar/AvatarGroup/AvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarGroup.js","sourceRoot":"","sources":["../../../src/Avatar/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,MAA0B,MAAM,WAAW,CAAA;AAClD,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAC1D,OAAO,UAAU,MAAM,0BAA0B,CAAA;AACjD,OAAO,MAAM,MAAM,UAAU,CAAA;AAuB7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,oBAAoB;CAC3B,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,CAAC,EACnB,SAAS,EACT,KAAK,EACL,OAAO,EACP,KAAK,EACL,KAAK,EACL,IAAI,EACE,EAAE,EAAE;IACV,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,uEAAuE;IACvE,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,KAAM,CAAA;IACzC,yFAAyF;IACzF,uEAAuE;IACvE,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,GAAG,KAAM,GAAG,CAAC,CAAA;IAChD,MAAM,eAAe,GAAG,OAAO,CAC7B,GAAG,EAAE;IACH,uEAAuE;IACvE,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,EAClD,CAAC,WAAW,EAAE,KAAK,EAAE,KAAK,CAAC,CAC5B,CAAA;IAED,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACtB,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,iBACzB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,EAC/B,IAAI,QACJ,GAAG,EAAC,QAAQ,EACZ,KAAK,EAAE,KAAK;QAEX,eAAe,CAAC,GAAG,CAClB,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,aAAa,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAC1D,oBAAC,MAAM,IACL,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,IAAI,IAAI,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE,EACtC,IAAI,EAAE,IAAI;YACV,uEAAuE;YACvE,IAAI,EAAE,IAAK,EACX,GAAG,EAAE,GAAG,iBACK,YAAY,GACzB,CACH,CACF;QACA,WAAW,CAAC,CAAC,CAAC;QACb,uEAAuE;QACvE,oBAAC,aAAa,IAAC,IAAI,EAAE,IAAK,EAAE,OAAO,EAAC,QAAQ;YAE1C,oBAAC,UAAU,mBAAc,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,EAAE,IAAI,EAAE,IAAK;;gBACpD,cAAc,CACL,CACC,CACjB,CAAC,CAAC,CAAC,IAAI,CACE,CACb,CAAA;AACH,CAAC,CAAA;AAED,WAAW,CAAC,YAAY,GAAG;IACzB,KAAK,EAAE,CAAC;IACR,IAAI,EAAE,QAAQ;CACf,CAAA;AAED,eAAe,WAAW,CAAA"}

package/Avatar/AvatarGroup/styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("@material-ui/styles").StyleRules<{}, "root">;
+export default _default;

package/Avatar/AvatarGroup/styles.js

@@ -0,0 +1,8 @@
+import { createStyles } from '@material-ui/core/styles';
+export default () => createStyles({
+    root: {
+        maxWidth: '100%',
+        overflowX: 'auto'
+    }
+});
+//# sourceMappingURL=styles.js.map

package/Avatar/AvatarGroup/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Avatar/AvatarGroup/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,QAAQ,EAAE,MAAM;QAChB,SAAS,EAAE,MAAM;KAClB;CACF,CAAC,CAAA"}

package/Avatar/AvatarWrapper/AvatarWrapper.d.ts

@@ -0,0 +1,10 @@
+import { FunctionComponent, ReactNode } from 'react';
+import { BaseProps } from '@toptal/picasso-shared';
+import { AvatarSizeType, VariantType } from '../Avatar';
+export interface Props extends BaseProps {
+    children: ReactNode;
+    size: AvatarSizeType;
+    variant: VariantType;
+}
+declare const AvatarWrapper: FunctionComponent<Props>;
+export default AvatarWrapper;

package/Avatar/AvatarWrapper/AvatarWrapper.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import cx from 'classnames';
+import styles from './styles';
+const useStyles = makeStyles(styles, {
+    name: 'PicassoAvatarWrapper'
+});
+const AvatarWrapper = props => {
+    const { children, className, style, 'data-testid': dataTestId } = props;
+    const classes = useStyles(props);
+    return (React.createElement("div", { style: style, "data-testid": dataTestId, className: cx(className, classes.root, classes.size, classes.corner) }, children));
+};
+export default AvatarWrapper;
+//# sourceMappingURL=AvatarWrapper.js.map

package/Avatar/AvatarWrapper/AvatarWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarWrapper.js","sourceRoot":"","sources":["../../../src/Avatar/AvatarWrapper/AvatarWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAA;AAC3D,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAE5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,MAAM,MAAM,UAAU,CAAA;AAS7B,MAAM,SAAS,GAAG,UAAU,CAAe,MAAM,EAAE;IACjD,IAAI,EAAE,sBAAsB;CAC7B,CAAC,CAAA;AAEF,MAAM,aAAa,GAA6B,KAAK,CAAC,EAAE;IACtD,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,GAAG,KAAK,CAAA;IACvE,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAEhC,OAAO,CACL,6BACE,KAAK,EAAE,KAAK,iBACC,UAAU,EACvB,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,MAAM,CAAC,IAEnE,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,aAAa,CAAA"}

package/Avatar/AvatarWrapper/styles.d.ts

@@ -0,0 +1,4 @@
+import { Theme } from '@material-ui/core/styles';
+import { Props } from './AvatarWrapper';
+declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<Props, "size" | "root" | "corner">;
+export default _default;

package/Avatar/AvatarWrapper/styles.js

@@ -0,0 +1,53 @@
+import { createStyles } from '@material-ui/core/styles';
+const SETTINGS = {
+    xxsmall: {
+        dimensions: 2,
+        cornerSize: '0.5em'
+    },
+    xsmall: {
+        dimensions: 2.5,
+        cornerSize: '0.5em'
+    },
+    small: {
+        dimensions: 5,
+        cornerSize: '1em'
+    },
+    medium: {
+        dimensions: 7.5,
+        cornerSize: '1.5em'
+    },
+    large: {
+        dimensions: 10,
+        cornerSize: '1.5em'
+    }
+};
+export default ({ palette }) => createStyles({
+    root: {
+        position: 'relative',
+        backgroundColor: palette.grey.main,
+        fontSize: '1rem',
+        flexShrink: 0,
+        flexGrow: 0
+    },
+    size: ({ size, variant }) => {
+        const { dimensions } = SETTINGS[size];
+        const ratio = size === 'large' ? 3 / 4 : 2 / 3;
+        const widthRatio = variant === 'portrait' ? ratio : 1;
+        const heightRatio = variant === 'landscape' ? ratio : 1;
+        return {
+            width: `${dimensions * widthRatio}em`,
+            height: `${dimensions * heightRatio}em`
+        };
+    },
+    corner: ({ size }) => {
+        const { cornerSize } = SETTINGS[size];
+        const clipPath = `polygon(0 0, 100% 0, 100% 100%, ${cornerSize} 100%, 0 calc(100% - ${cornerSize}))`;
+        return {
+            clipPath,
+            // we can remove this prefix as soon as this issue will
+            // be resolved - https://github.com/cssinjs/css-vendor/issues/74
+            '-webkit-clip-path': clipPath
+        };
+    }
+});
+//# sourceMappingURL=styles.js.map

package/Avatar/AvatarWrapper/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Avatar/AvatarWrapper/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAS,MAAM,0BAA0B,CAAA;AAI9D,MAAM,QAAQ,GAAG;IACf,OAAO,EAAE;QACP,UAAU,EAAE,CAAC;QACb,UAAU,EAAE,OAAO;KACpB;IACD,MAAM,EAAE;QACN,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,OAAO;KACpB;IACD,KAAK,EAAE;QACL,UAAU,EAAE,CAAC;QACb,UAAU,EAAE,KAAK;KAClB;IACD,MAAM,EAAE;QACN,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,OAAO;KACpB;IACD,KAAK,EAAE;QACL,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,OAAO;KACpB;CACO,CAAA;AAEV,eAAe,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE,CACpC,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,QAAQ,EAAE,UAAU;QACpB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;QAClC,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,CAAC;QACb,QAAQ,EAAE,CAAC;KACZ;IACD,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAS,EAAE,EAAE;QACjC,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;QACrC,MAAM,KAAK,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;QAC9C,MAAM,UAAU,GAAG,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;QACrD,MAAM,WAAW,GAAG,OAAO,KAAK,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;QAEvD,OAAO;YACL,KAAK,EAAE,GAAG,UAAU,GAAG,UAAU,IAAI;YACrC,MAAM,EAAE,GAAG,UAAU,GAAG,WAAW,IAAI;SACxC,CAAA;IACH,CAAC;IAED,MAAM,EAAE,CAAC,EAAE,IAAI,EAAS,EAAE,EAAE;QAC1B,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;QACrC,MAAM,QAAQ,GAAG,mCAAmC,UAAU,wBAAwB,UAAU,IAAI,CAAA;QAEpG,OAAO;YACL,QAAQ;YACR,uDAAuD;YACvD,gEAAgE;YAChE,mBAAmB,EAAE,QAAQ;SAC9B,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/Avatar/IconAvatar/IconAvatar.d.ts

@@ -0,0 +1,7 @@
+import { BaseProps } from '@toptal/picasso-shared';
+import type { AvatarSizeType } from '../Avatar';
+interface Props extends BaseProps {
+    size: AvatarSizeType;
+}
+declare const IconAvatar: ({ size, "data-testid": dataTestId, className, style }: Props) => JSX.Element;
+export default IconAvatar;

package/Avatar/IconAvatar/IconAvatar.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import cx from 'classnames';
+import { makeStyles } from '@material-ui/core/styles';
+import { Profile16 } from '../..';
+import styles from './styles';
+const useStyles = makeStyles(styles, {
+    name: 'PicassoIconAvatar'
+});
+const IconAvatar = ({ size, 'data-testid': dataTestId, className, style }) => {
+    const classes = useStyles();
+    return (React.createElement(Profile16, { className: cx(className, classes.root, classes[`${size}Icon`]), color: 'white', "data-testid": dataTestId, style: style }));
+};
+export default IconAvatar;
+//# sourceMappingURL=IconAvatar.js.map

package/Avatar/IconAvatar/IconAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconAvatar.js","sourceRoot":"","sources":["../../../src/Avatar/IconAvatar/IconAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAI5D,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,MAAM,MAAM,UAAU,CAAA;AAM7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,mBAAmB;CAC1B,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,EAClB,IAAI,EACJ,aAAa,EAAE,UAAU,EACzB,SAAS,EACT,KAAK,EACC,EAAE,EAAE;IACV,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAI,MAAM,CAAC,CAAC,EAC9D,KAAK,EAAC,OAAO,iBACA,UAAU,EACvB,KAAK,EAAE,KAAK,GACZ,CACH,CAAA;AACH,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/Avatar/IconAvatar/styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("@material-ui/styles").StyleRules<{}, "root" | "xxsmallIcon" | "xsmallIcon" | "smallIcon" | "mediumIcon" | "largeIcon">;
+export default _default;

package/Avatar/IconAvatar/styles.js

@@ -0,0 +1,15 @@
+import { createStyles } from '@material-ui/core/styles';
+export default () => createStyles({
+    root: {
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+    },
+    xxsmallIcon: { fontSize: '1em' },
+    xsmallIcon: { fontSize: '1em' },
+    smallIcon: { fontSize: '1.5em' },
+    mediumIcon: { fontSize: '1.875em' },
+    largeIcon: { fontSize: '3em' }
+});
+//# sourceMappingURL=styles.js.map

package/Avatar/IconAvatar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Avatar/IconAvatar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,KAAK;QACV,IAAI,EAAE,KAAK;QACX,SAAS,EAAE,uBAAuB;KACnC;IACD,WAAW,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAChC,UAAU,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC/B,SAAS,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE;IAChC,UAAU,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE;IACnC,SAAS,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;CAC/B,CAAC,CAAA"}

package/Avatar/ImageAvatar/ImageAvatar.d.ts

@@ -0,0 +1,10 @@
+import { BaseProps } from '@toptal/picasso-shared';
+import type { AvatarSizeType } from '../Avatar';
+export interface Props extends BaseProps {
+    size: AvatarSizeType;
+    src: string;
+    alt?: string;
+    name?: string;
+}
+declare const ImageAvatar: (props: Props) => JSX.Element;
+export default ImageAvatar;

package/Avatar/ImageAvatar/ImageAvatar.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import cx from 'classnames';
+import { makeStyles } from '@material-ui/core/styles';
+import Image from '../../Image';
+import Logo from '../../Logo';
+import styles from './styles';
+const useStyles = makeStyles(styles, {
+    name: 'PicassoImageAvatar'
+});
+const AvatarLogo = ({ size, classes }) => {
+    const isTooSmall = ['small', 'xsmall', 'xxsmall'].includes(size);
+    if (isTooSmall) {
+        return null;
+    }
+    return (React.createElement("div", { className: classes.logoContainer, role: 'img', "aria-label": 'photo placeholder' },
+        React.createElement(Logo, { emblem: true, variant: 'white', className: classes.logo })));
+};
+const ImageAvatar = (props) => {
+    const { alt, className, name, size, src, style, 'data-testid': dataTestId } = props;
+    const classes = useStyles(props);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Image, { alt: alt || name || '', className: cx(classes.image, className), src: src, style: style, "data-testid": dataTestId }),
+        React.createElement(AvatarLogo, { classes: classes, size: size })));
+};
+export default ImageAvatar;
+//# sourceMappingURL=ImageAvatar.js.map

package/Avatar/ImageAvatar/ImageAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageAvatar.js","sourceRoot":"","sources":["../../../src/Avatar/ImageAvatar/ImageAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAE5D,OAAO,KAAK,MAAM,aAAa,CAAA;AAC/B,OAAO,IAAI,MAAM,YAAY,CAAA;AAE7B,OAAO,MAAM,MAAM,UAAU,CAAA;AAa7B,MAAM,SAAS,GAAG,UAAU,CAAe,MAAM,EAAE;IACjD,IAAI,EAAE,oBAAoB;CAC3B,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAa,EAAE,EAAE;IAClD,MAAM,UAAU,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAEhE,IAAI,UAAU,EAAE;QACd,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BACE,SAAS,EAAE,OAAO,CAAC,aAAa,EAChC,IAAI,EAAC,KAAK,gBACC,mBAAmB;QAE9B,oBAAC,IAAI,IAAC,MAAM,QAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAE,OAAO,CAAC,IAAI,GAAI,CACpD,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,KAAY,EAAE,EAAE;IACnC,MAAM,EACJ,GAAG,EACH,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,KAAK,EACL,aAAa,EAAE,UAAU,EAC1B,GAAG,KAAK,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAEhC,OAAO,CACL;QACE,oBAAC,KAAK,IACJ,GAAG,EAAE,GAAG,IAAI,IAAI,IAAI,EAAE,EACtB,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,SAAS,CAAC,EACvC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,iBACC,UAAU,GACvB;QACF,oBAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,GAAI,CAC3C,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}

package/Avatar/ImageAvatar/styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("@material-ui/styles").StyleRules<{}, "image" | "logoContainer" | "logo">;
+export default _default;

package/Avatar/ImageAvatar/styles.js

@@ -0,0 +1,23 @@
+import { rem } from '@toptal/picasso-shared';
+import { createStyles } from '@material-ui/core/styles';
+export default () => createStyles({
+    image: {
+        objectFit: 'cover',
+        width: '100%',
+        height: '100%',
+        position: 'absolute',
+        left: 0,
+        top: 0
+    },
+    logoContainer: {
+        display: 'flex',
+        position: 'absolute',
+        bottom: '1rem',
+        left: '1rem'
+    },
+    logo: {
+        width: rem('17px'),
+        height: rem('24px')
+    }
+});
+//# sourceMappingURL=styles.js.map

package/Avatar/ImageAvatar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Avatar/ImageAvatar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,KAAK,EAAE;QACL,SAAS,EAAE,OAAO;QAClB,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,UAAU;QACpB,IAAI,EAAE,CAAC;QACP,GAAG,EAAE,CAAC;KACP;IACD,aAAa,EAAE;QACb,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,MAAM;KACb;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC;QAClB,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC;KACpB;CACF,CAAC,CAAA"}

package/Avatar/TextAvatar/TextAvatar.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { BaseProps, SizeType } from '@toptal/picasso-shared';
+import type { AvatarSizeType } from '../Avatar';
+interface Props extends BaseProps {
+    children: ReactNode;
+    fontSize?: SizeType<'small' | 'large'>;
+    size: AvatarSizeType;
+}
+declare const TextAvatar: {
+    ({ children, className, style, "data-testid": dataTestID, fontSize, size }: Props): JSX.Element;
+    defaultProps: {
+        size: string;
+    };
+};
+export default TextAvatar;

package/Avatar/TextAvatar/TextAvatar.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import cx from 'classnames';
+import { makeStyles } from '@material-ui/core/styles';
+import { Typography } from '../..';
+import styles from './styles';
+const useStyles = makeStyles(styles, {
+    name: 'PicassoTextAvatar'
+});
+const TextAvatar = ({ children, className, style, 'data-testid': dataTestID, fontSize, size }) => {
+    const classes = useStyles();
+    return (React.createElement("div", { 
+        /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+        className: cx(classes.root, className, classes[size]), style: style },
+        React.createElement(Typography, { "data-testid": dataTestID, 
+            /* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */
+            className: classes[`${fontSize}Font`], invert: true }, children)));
+};
+TextAvatar.defaultProps = {
+    size: 'large'
+};
+export default TextAvatar;
+//# sourceMappingURL=TextAvatar.js.map

package/Avatar/TextAvatar/TextAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAvatar.js","sourceRoot":"","sources":["../../../src/Avatar/TextAvatar/TextAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAG5D,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAClC,OAAO,MAAM,MAAM,UAAU,CAAA;AAS7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,mBAAmB;CAC1B,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,EAClB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,aAAa,EAAE,UAAU,EACzB,QAAQ,EACR,IAAI,EACE,EAAE,EAAE;IACV,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,OAAO,CACL;QACE,uEAAuE;QACvE,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,IAAK,CAAC,CAAC,EACtD,KAAK,EAAE,KAAK;QAEZ,oBAAC,UAAU,mBACI,UAAU;YACvB,uEAAuE;YACvE,SAAS,EAAE,OAAO,CAAC,GAAG,QAAS,MAAM,CAAC,EACtC,MAAM,UAEL,QAAQ,CACE,CACT,CACP,CAAA;AACH,CAAC,CAAA;AAED,UAAU,CAAC,YAAY,GAAG;IACxB,IAAI,EAAE,OAAO;CACd,CAAA;AAED,eAAe,UAAU,CAAA"}

package/Avatar/TextAvatar/styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("@material-ui/styles").StyleRules<{}, "medium" | "large" | "small" | "root" | "xxsmall" | "xsmall" | "smallFont" | "largeFont">;
+export default _default;

package/Avatar/TextAvatar/styles.js

@@ -0,0 +1,22 @@
+import { createStyles } from '@material-ui/core/styles';
+export default () => createStyles({
+    root: {
+        textTransform: 'uppercase',
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)'
+    },
+    xxsmall: { fontSize: '1em' },
+    xsmall: { fontSize: '1em' },
+    small: { fontSize: '2em' },
+    medium: { fontSize: '3em' },
+    large: { fontSize: '5em' },
+    smallFont: {
+        fontSize: '0.666666667em'
+    },
+    largeFont: {
+        fontSize: '1em'
+    }
+});
+//# sourceMappingURL=styles.js.map

package/Avatar/TextAvatar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Avatar/TextAvatar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,aAAa,EAAE,WAAW;QAC1B,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,KAAK;QACV,IAAI,EAAE,KAAK;QACX,SAAS,EAAE,uBAAuB;KACnC;IAED,OAAO,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC5B,MAAM,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC3B,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC1B,MAAM,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAC3B,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE;IAE1B,SAAS,EAAE;QACT,QAAQ,EAAE,eAAe;KAC1B;IACD,SAAS,EAAE;QACT,QAAQ,EAAE,KAAK;KAChB;CACF,CAAC,CAAA"}

package/Avatar/utils/getClipPathCornerMask.d.ts

@@ -0,0 +1,3 @@
+import { AvatarSizeType } from './../Avatar';
+declare const getClipPathCornerMask: (size: AvatarSizeType) => string;
+export default getClipPathCornerMask;

package/Avatar/utils/getClipPathCornerMask.js

@@ -0,0 +1,10 @@
+const CORNER_SIZE = {
+    xxsmall: '0.5rem',
+    xsmall: '0.5rem',
+    small: '1rem',
+    medium: '1.5rem',
+    large: '1.5rem'
+};
+const getClipPathCornerMask = (size) => `polygon(0 0, 100% 0, 100% 100%, ${CORNER_SIZE[size]} 100%, 0 calc(100% - ${CORNER_SIZE[size]}))`;
+export default getClipPathCornerMask;
+//# sourceMappingURL=getClipPathCornerMask.js.map

package/Avatar/utils/getClipPathCornerMask.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getClipPathCornerMask.js","sourceRoot":"","sources":["../../../src/Avatar/utils/getClipPathCornerMask.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,QAAQ;IACjB,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,QAAQ;CACP,CAAA;AAEV,MAAM,qBAAqB,GAAG,CAAC,IAAoB,EAAE,EAAE,CACrD,mCAAmC,WAAW,CAAC,IAAI,CAAC,wBAAwB,WAAW,CAAC,IAAI,CAAC,IAAI,CAAA;AAEnG,eAAe,qBAAqB,CAAA"}

package/Avatar/utils/getDimensions.d.ts

@@ -0,0 +1,12 @@
+import { VariantType } from '../Avatar';
+declare const getDimensions: (variant: VariantType) => {
+    readonly width: "2.5em";
+    readonly height: "2.5em";
+} | {
+    readonly width: "1.6667em";
+    readonly height: "2.5em";
+} | {
+    readonly width: "2.5em";
+    readonly height: "1.6667em";
+};
+export default getDimensions;

package/Avatar/utils/getDimensions.js

@@ -0,0 +1,17 @@
+const DIMENSIONS_BY_VARIANT = {
+    square: {
+        width: '2.5em',
+        height: '2.5em'
+    },
+    portrait: {
+        width: '1.6667em',
+        height: '2.5em'
+    },
+    landscape: {
+        width: '2.5em',
+        height: '1.6667em'
+    }
+};
+const getDimensions = (variant) => DIMENSIONS_BY_VARIANT[variant];
+export default getDimensions;
+//# sourceMappingURL=getDimensions.js.map

package/Avatar/utils/getDimensions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getDimensions.js","sourceRoot":"","sources":["../../../src/Avatar/utils/getDimensions.ts"],"names":[],"mappings":"AAEA,MAAM,qBAAqB,GAAG;IAC5B,MAAM,EAAE;QACN,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,OAAO;KAChB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,UAAU;QACjB,MAAM,EAAE,OAAO;KAChB;IACD,SAAS,EAAE;QACT,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,UAAU;KACnB;CACO,CAAA;AAEV,MAAM,aAAa,GAAG,CAAC,OAAoB,EAAE,EAAE,CAAC,qBAAqB,CAAC,OAAO,CAAC,CAAA;AAE9E,eAAe,aAAa,CAAA"}

package/Notification/Notification.js

@@ -41,14 +41,11 @@ const renderNotificationIcon = ({ icon, variant, classes }) => {
     }
 };
 const renderNotificationContent = (props) => {
-    const { classes, children, onClose } = props;
+    const { classes, children, onClose, variant } = props;
+    const capitalizedVariant = capitalize(variant);
     return (React.createElement(Container, { flex: true, className: classes === null || classes === void 0 ? void 0 : classes.contentWrapper },
-        React.createElement(Container, { flex: true, alignItems: 'center', className: classes === null || classes === void 0 ? void 0 : classes.iconWrapper }, renderNotificationIcon(props)),
-        React.createElement(Typography, { size: 'medium', className: cx(classes === null || classes === void 0 ? void 0 : classes.content, (classes === null || classes === void 0 ? void 0 : classes.contentCloseButton)
-                ? {
-                    [classes.contentCloseButton]: onClose
-                }
-                : undefined), as: 'div' }, children),
+        React.createElement(Container, { flex: true, alignItems: 'center', className: cx(classes === null || classes === void 0 ? void 0 : classes.iconWrapper, classes === null || classes === void 0 ? void 0 : classes[`iconWrapper${capitalizedVariant}`]) }, renderNotificationIcon(props)),
+        React.createElement(Typography, { size: 'medium', className: cx(classes === null || classes === void 0 ? void 0 : classes.content, classes === null || classes === void 0 ? void 0 : classes[`content${capitalizedVariant}`]), as: 'div' }, children),
         onClose && renderNotificationCloseButton(props)));
 };
 const useStyles = makeStyles(styles, {

package/Notification/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sourceRoot":"","sources":["../../src/Notification/Notification.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Notification.js","sourceRoot":"","sources":["../../src/Notification/Notification.tsx"],"names":[],"mappings":"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"}

package/Notification/styles.d.ts

@@ -1,3 +1,3 @@
 import { Theme } from '@material-ui/core/styles';
-declare const _default: ({ palette: { red, green, yellow, common, text }, shadows, sizes: { borderRadius }, layout }: Theme) => import("@material-ui/styles").StyleRules<{}, "content" | "close" | "notification" | "notificationShadow" | "roundedBorders" | "notificationRed" | "notificationGreen" | "notificationWhite" | "notificationYellow" | "contentCloseButton" | "iconWrapper" | "closeIcon">;
+declare const _default: ({ palette: { red, green, yellow, common, text }, shadows, sizes: { borderRadius } }: Theme) => import("@material-ui/styles").StyleRules<{}, "content" | "close" | "notification" | "notificationShadow" | "roundedBorders" | "notificationRed" | "notificationGreen" | "notificationWhite" | "notificationYellow" | "contentYellow" | "iconWrapper" | "iconWrapperYellow" | "closeIcon">;
 export default _default;

package/Notification/styles.js

@@ -1,27 +1,31 @@
 import { createStyles } from '@material-ui/core/styles';
 import { PicassoProvider } from '@toptal/picasso-provider';
+import { rem } from '@toptal/picasso-shared';
 PicassoProvider.override(({ layout }) => ({
     MuiSnackbarContent: {
         message: {
             display: 'flex',
             maxWidth: layout.contentWidth,
-            padding: `0 ${layout.contentPaddingHorizontal}`,
+            padding: 0,
             width: '100%',
             minWidth: 0,
-            margin: '0 auto'
+            margin: '0 auto',
+            '& > div': {
+                width: '100%'
+            }
         }
     }
 }));
-export default ({ palette: { red, green, yellow, common, text }, shadows, sizes: { borderRadius }, layout }) => createStyles({
+export default ({ palette: { red, green, yellow, common, text }, shadows, sizes: { borderRadius } }) => createStyles({
     notification: {
         alignItems: 'start',
         borderRadius: 0,
         flexWrap: 'nowrap',
         maxWidth: 'initial',
-        padding: `1.5em calc(1.5em - ${layout.contentPaddingHorizontal})`,
         position: 'relative',
         width: '100%',
-        boxShadow: 'none'
+        boxShadow: 'none',
+        padding: '1.5em 2.5em 1.5625em 1.5em'
     },
     notificationShadow: {
         boxShadow: shadows[3]
@@ -36,34 +40,48 @@ export default ({ palette: { red, green, yellow, common, text }, shadows, sizes:
         background: green.lighter
     },
     notificationWhite: {
-        background: common.white
+        background: common.white,
+        padding: '1.5625em 1.5em 1.5em'
     },
     notificationYellow: {
-        background: yellow.lighter
+        background: yellow.lighter,
+        padding: `1.5em ${rem('130px')}`
     },
     // Content
     content: {
         color: common.black,
         overflowWrap: 'break-word',
-        minWidth: 0
+        minWidth: 0,
+        lineHeight: rem('22px'),
+        fontSize: rem('14px'),
+        marginTop: '1px'
     },
-    contentCloseButton: {
-        paddingRight: '1.5em'
+    contentYellow: {
+        lineHeight: rem('20px'),
+        fontSize: rem('13px'),
+        marginTop: 0
     },
     // Content Icon
     iconWrapper: {
         flexBasis: '1.5em',
         marginRight: '1em',
         minWidth: '1.5em',
-        height: '1.3125em'
+        height: '1.5em'
+    },
+    iconWrapperYellow: {
+        flexBasis: 'unset',
+        minWidth: '1em',
+        height: '1em',
+        marginTop: '2px'
     },
     close: {
         position: 'absolute',
-        right: '1.4em',
-        top: '1.4em',
+        right: '0.5em',
+        top: '0.75em',
         background: 'transparent',
         border: 0,
         padding: 0,
+        height: '1em',
         '&:hover': {
             background: 'transparent'
         }

package/Notification/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/Notification/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAS,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAE1D,eAAe,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAS,EAAE,EAAE,CAAC,CAAC;IAC/C,kBAAkB,EAAE;QAClB,OAAO,EAAE;YACP,OAAO,EAAE,MAAM;YACf,QAAQ,EAAE,MAAM,CAAC,YAAY;YAC7B,OAAO,EAAE,KAAK,MAAM,CAAC,wBAAwB,EAAE;YAC/C,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,CAAC;YACX,MAAM,EAAE,QAAQ;SACjB;KACF;CACF,CAAC,CAAC,CAAA;AAEH,eAAe,CAAC,EACd,OAAO,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,EAC7C,OAAO,EACP,KAAK,EAAE,EAAE,YAAY,EAAE,EACvB,MAAM,EACA,EAAE,EAAE,CACV,YAAY,CAAC;IACX,YAAY,EAAE;QACZ,UAAU,EAAE,OAAO;QACnB,YAAY,EAAE,CAAC;QACf,QAAQ,EAAE,QAAQ;QAClB,QAAQ,EAAE,SAAS;QACnB,OAAO,EAAE,sBAAsB,MAAM,CAAC,wBAAwB,GAAG;QACjE,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,MAAM;KAClB;IACD,kBAAkB,EAAE;QAClB,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;KACtB;IACD,cAAc,EAAE;QACd,YAAY,EAAE,YAAY,CAAC,KAAK;KACjC;IACD,eAAe,EAAE;QACf,UAAU,EAAE,GAAG,CAAC,OAAO;KACxB;IACD,iBAAiB,EAAE;QACjB,UAAU,EAAE,KAAK,CAAC,OAAO;KAC1B;IACD,iBAAiB,EAAE;QACjB,UAAU,EAAE,MAAM,CAAC,KAAK;KACzB;IACD,kBAAkB,EAAE;QAClB,UAAU,EAAE,MAAM,CAAC,OAAO;KAC3B;IAED,UAAU;IACV,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,YAAY,EAAE,YAAY;QAC1B,QAAQ,EAAE,CAAC;KACZ;IACD,kBAAkB,EAAE;QAClB,YAAY,EAAE,OAAO;KACtB;IAED,eAAe;IACf,WAAW,EAAE;QACX,SAAS,EAAE,OAAO;QAClB,WAAW,EAAE,KAAK;QAClB,QAAQ,EAAE,OAAO;QACjB,MAAM,EAAE,UAAU;KACnB;IAED,KAAK,EAAE;QACL,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,OAAO;QACd,GAAG,EAAE,OAAO;QACZ,UAAU,EAAE,aAAa;QACzB,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;QAEV,SAAS,EAAE;YACT,UAAU,EAAE,aAAa;SAC1B;KACF;IACD,SAAS,EAAE;QACT,IAAI,EAAE,IAAI,CAAC,OAAO;KACnB;CACF,CAAC,CAAA"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/Notification/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAS,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAE5C,eAAe,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAS,EAAE,EAAE,CAAC,CAAC;IAC/C,kBAAkB,EAAE;QAClB,OAAO,EAAE;YACP,OAAO,EAAE,MAAM;YACf,QAAQ,EAAE,MAAM,CAAC,YAAY;YAC7B,OAAO,EAAE,CAAC;YACV,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,CAAC;YACX,MAAM,EAAE,QAAQ;YAEhB,SAAS,EAAE;gBACT,KAAK,EAAE,MAAM;aACd;SACF;KACF;CACF,CAAC,CAAC,CAAA;AAEH,eAAe,CAAC,EACd,OAAO,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,EAC7C,OAAO,EACP,KAAK,EAAE,EAAE,YAAY,EAAE,EACjB,EAAE,EAAE,CACV,YAAY,CAAC;IACX,YAAY,EAAE;QACZ,UAAU,EAAE,OAAO;QACnB,YAAY,EAAE,CAAC;QACf,QAAQ,EAAE,QAAQ;QAClB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,MAAM;QACjB,OAAO,EAAE,4BAA4B;KACtC;IACD,kBAAkB,EAAE;QAClB,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;KACtB;IACD,cAAc,EAAE;QACd,YAAY,EAAE,YAAY,CAAC,KAAK;KACjC;IACD,eAAe,EAAE;QACf,UAAU,EAAE,GAAG,CAAC,OAAO;KACxB;IACD,iBAAiB,EAAE;QACjB,UAAU,EAAE,KAAK,CAAC,OAAO;KAC1B;IACD,iBAAiB,EAAE;QACjB,UAAU,EAAE,MAAM,CAAC,KAAK;QACxB,OAAO,EAAE,sBAAsB;KAChC;IACD,kBAAkB,EAAE;QAClB,UAAU,EAAE,MAAM,CAAC,OAAO;QAC1B,OAAO,EAAE,SAAS,GAAG,CAAC,OAAO,CAAC,EAAE;KACjC;IAED,UAAU;IACV,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,YAAY,EAAE,YAAY;QAC1B,QAAQ,EAAE,CAAC;QACX,UAAU,EAAE,GAAG,CAAC,MAAM,CAAC;QACvB,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC;QACrB,SAAS,EAAE,KAAK;KACjB;IACD,aAAa,EAAE;QACb,UAAU,EAAE,GAAG,CAAC,MAAM,CAAC;QACvB,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC;QACrB,SAAS,EAAE,CAAC;KACb;IAED,eAAe;IACf,WAAW,EAAE;QACX,SAAS,EAAE,OAAO;QAClB,WAAW,EAAE,KAAK;QAClB,QAAQ,EAAE,OAAO;QACjB,MAAM,EAAE,OAAO;KAChB;IACD,iBAAiB,EAAE;QACjB,SAAS,EAAE,OAAO;QAClB,QAAQ,EAAE,KAAK;QACf,MAAM,EAAE,KAAK;QACb,SAAS,EAAE,KAAK;KACjB;IAED,KAAK,EAAE;QACL,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,OAAO;QACd,GAAG,EAAE,QAAQ;QACb,UAAU,EAAE,aAAa;QACzB,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;QACV,MAAM,EAAE,KAAK;QAEb,SAAS,EAAE;YACT,UAAU,EAAE,aAAa;SAC1B;KACF;IACD,SAAS,EAAE;QACT,IAAI,EAAE,IAAI,CAAC,OAAO;KACnB;CACF,CAAC,CAAA"}

package/PromptModal/PromptModal.d.ts

@@ -28,6 +28,12 @@ export interface Props extends Omit<ModalProps, 'children' | 'onSubmit'> {
     /** Callback on Cancel onClick event */
     onCancel?: () => void;
     onClose?: () => void;
+    testIds?: {
+        title?: string;
+        message?: string;
+        closeButton?: string;
+        submitButton?: string;
+    };
 }
 export declare const PromptModal: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
 export default PromptModal;

package/PromptModal/PromptModal.js

@@ -30,7 +30,7 @@ const useStyles = makeStyles(styles, {
     name: 'PicassoPromptModal'
 });
 export const PromptModal = forwardRef(function PromptModal(props, ref) {
-    const { children, title, message, variant, submitText, cancelText, onSubmit, onAfterSubmit = noop, onCancel = noop, onClose } = props, rest = __rest(props, ["children", "title", "message", "variant", "submitText", "cancelText", "onSubmit", "onAfterSubmit", "onCancel", "onClose"]);
+    const { children, title, message, variant, submitText, cancelText, onSubmit, onAfterSubmit = noop, onCancel = noop, onClose, testIds } = props, rest = __rest(props, ["children", "title", "message", "variant", "submitText", "cancelText", "onSubmit", "onAfterSubmit", "onCancel", "onClose", "testIds"]);
     const classes = useStyles();
     const [result, setResult] = useSafeState();
     const [loading, setLoading] = useSafeState(false);
@@ -63,9 +63,9 @@ export const PromptModal = forwardRef(function PromptModal(props, ref) {
         }
     };
     return (React.createElement(Modal, Object.assign({ ref: ref, onClose: onClose && handleClose, classes: classes }, rest),
-        title && React.createElement(Modal.Title, null, title),
+        title && React.createElement(Modal.Title, { "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.title }, title),
         React.createElement(Modal.Content, null,
-            React.createElement(Typography, { size: 'medium' }, message),
+            React.createElement(Typography, { size: 'medium', "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.message }, message),
             children && (React.createElement(Container, { top: 'xsmall' }, children({
                 setResult,
                 result,
@@ -75,8 +75,8 @@ export const PromptModal = forwardRef(function PromptModal(props, ref) {
                 error
             })))),
         React.createElement(Modal.Actions, null,
-            React.createElement(Button, { disabled: loading, variant: 'secondary', onClick: handleCancel }, cancelText),
-            React.createElement(Button, { loading: loading, onClick: handleSubmit, variant: `${variant}` }, submitText))));
+            React.createElement(Button, { disabled: loading, variant: 'secondary', onClick: handleCancel, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.closeButton }, cancelText),
+            React.createElement(Button, { loading: loading, onClick: handleSubmit, variant: `${variant}`, "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.submitButton }, submitText))));
 });
 PromptModal.defaultProps = {
     cancelText: 'Cancel',

package/PromptModal/PromptModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"PromptModal.js","sourceRoot":"","sources":["../../src/PromptModal/PromptModal.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PromptModal.js","sourceRoot":"","sources":["../../src/PromptModal/PromptModal.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso",
-  "version": "13.0.0",
+  "version": "13.2.1",
   "description": "Toptal UI components library",
   "publishConfig": {
     "access": "public"
@@ -69,5 +69,5 @@
     "**/styles.ts",
     "**/styles.js"
   ],
-  "gitHead": "f59c9963cff9a28d7ff55a456f4437721680a003"
+  "gitHead": "bdd7209bb257ca336cac9879328e25f122c31cef"
 }

package/Avatar/IconAvatar.d.ts

@@ -1,9 +0,0 @@
-import { JssProps } from '@toptal/picasso-shared';
-import type { AvatarSizeType, VariantType } from './Avatar';
-declare type WithIconProps = {
-    size: AvatarSizeType;
-    variant: VariantType;
-    className?: string;
-} & JssProps;
-declare const WithIcon: ({ classes, size, variant, className }: WithIconProps) => JSX.Element;
-export default WithIcon;

package/Avatar/IconAvatar.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import ImagePlaceholder from './ImagePlaceholder';
-import { Profile16 } from '..';
-const WithIcon = ({ classes, size, variant, className }) => {
-    return (React.createElement(React.Fragment, null,
-        React.createElement(ImagePlaceholder, { variant: variant, size: size, className: className, classes: classes }),
-        React.createElement(Profile16, { className: cx(classes.centeredContent, classes[`${size}Icon`]), color: 'white' })));
-};
-export default WithIcon;
-//# sourceMappingURL=IconAvatar.js.map

package/Avatar/IconAvatar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconAvatar.js","sourceRoot":"","sources":["../../src/Avatar/IconAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,IAAI,CAAA;AAO9B,MAAM,QAAQ,GAAG,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAiB,EAAE,EAAE;IACxE,OAAO,CACL;QACE,oBAAC,gBAAgB,IACf,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB;QACF,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC,GAAG,IAAI,MAAM,CAAC,CAAC,EAC9D,KAAK,EAAC,OAAO,GACb,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,QAAQ,CAAA"}

package/Avatar/ImageAvatar.d.ts

@@ -1,9 +0,0 @@
-import { JssProps } from '@toptal/picasso-shared';
-import type { AvatarSizeType, VariantType, Props as AvatarProps } from './Avatar';
-declare type WithImageProps = {
-    variant: VariantType;
-    size: AvatarSizeType;
-    src: string;
-} & Pick<AvatarProps, 'alt' | 'name' | 'style' | 'className'> & JssProps;
-declare const WithImage: ({ alt, classes, className, name, size, src, style, variant }: WithImageProps) => JSX.Element | null;
-export default WithImage;

package/Avatar/ImageAvatar.js

@@ -1,40 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from 'react';
-import cx from 'classnames';
-import Image from '../Image';
-import Logo from '../Logo';
-const isBrowserSupportsObjectFit = 'objectFit' in document.documentElement.style;
-const renderLogo = ({ size, classes }) => {
-    const isTooSmall = ['small', 'xsmall', 'xxsmall'].includes(size);
-    if (isTooSmall) {
-        return null;
-    }
-    return (React.createElement("div", { className: classes.logoContainer },
-        React.createElement(Logo, { emblem: true, variant: 'white', className: classes.logo })));
-};
-// You will be surprised, but it's a IE11 fix for `object-fit: cover` for images
-const IE11Image = (_a) => {
-    var { style, src } = _a, rest = __rest(_a, ["style", "src"]);
-    return (React.createElement("div", Object.assign({ style: Object.assign({ backgroundImage: `url(${src})`, backgroundSize: 'cover', backgroundPosition: 'center center' }, style) }, rest)));
-};
-const WithImage = ({ alt, classes, className, name, size, src, style, variant }) => {
-    const ImageComponent = isBrowserSupportsObjectFit ? Image : IE11Image;
-    if (!src) {
-        return null;
-    }
-    return (React.createElement(React.Fragment, null,
-        React.createElement(ImageComponent, { alt: alt || String(name), className: cx(classes.image, classes[variant], classes[size], classes.clippedCorner, className), src: src, style: style }),
-        renderLogo({ classes, size })));
-};
-export default WithImage;
-//# sourceMappingURL=ImageAvatar.js.map

package/Avatar/ImageAvatar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImageAvatar.js","sourceRoot":"","sources":["../../src/Avatar/ImageAvatar.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,KAAK,MAAM,UAAU,CAAA;AAC5B,OAAO,IAAI,MAAM,SAAS,CAAA;AAQ1B,MAAM,0BAA0B,GAAG,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAA;AAKhF,MAAM,UAAU,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAa,EAAE,EAAE;IAClD,MAAM,UAAU,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAEhE,IAAI,UAAU,EAAE;QACd,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,OAAO,CAAC,aAAa;QACnC,oBAAC,IAAI,IAAC,MAAM,QAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAE,OAAO,CAAC,IAAI,GAAI,CACpD,CACP,CAAA;AACH,CAAC,CAAA;AAED,gFAAgF;AAChF,MAAM,SAAS,GAAG,CAAC,EAAsD,EAAE,EAAE;QAA1D,EAAE,KAAK,EAAE,GAAG,OAA0C,EAArC,IAAI,cAArB,gBAAuB,CAAF;IAAsC,OAAA,CAC5E,2CACE,KAAK,kBACH,eAAe,EAAE,OAAO,GAAG,GAAG,EAC9B,cAAc,EAAE,OAAO,EACvB,kBAAkB,EAAE,eAAe,IAChC,KAAK,KAEN,IAAI,EACR,CACH,CAAA;CAAA,CAAA;AAQD,MAAM,SAAS,GAAG,CAAC,EACjB,GAAG,EACH,OAAO,EACP,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,KAAK,EACL,OAAO,EACQ,EAAE,EAAE;IACnB,MAAM,cAAc,GAAG,0BAA0B,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAA;IAErE,IAAI,CAAC,GAAG,EAAE;QACR,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL;QACE,oBAAC,cAAc,IACb,GAAG,EAAE,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,EACxB,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,KAAK,EACb,OAAO,CAAC,OAAO,CAAC,EAChB,OAAO,CAAC,IAAI,CAAC,EACb,OAAO,CAAC,aAAa,EACrB,SAAS,CACV,EACD,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,GACZ;QACD,UAAU,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAC7B,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,SAAS,CAAA"}

package/Avatar/ImagePlaceholder.d.ts

@@ -1,9 +0,0 @@
-import { JssProps } from '@toptal/picasso-shared';
-import type { VariantType, AvatarSizeType } from './Avatar';
-declare type ImagePlaceholderProps = {
-    className?: string;
-    variant: VariantType;
-    size: AvatarSizeType;
-} & JssProps;
-declare const ImagePlaceholder: ({ size, variant, className, classes }: ImagePlaceholderProps) => JSX.Element;
-export default ImagePlaceholder;

package/Avatar/ImagePlaceholder.js

@@ -1,7 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-const ImagePlaceholder = ({ size, variant, className, classes }) => {
-    return (React.createElement("div", { className: cx(classes.textContainer, classes[variant], classes[size], classes.clippedCorner, className) }));
-};
-export default ImagePlaceholder;
-//# sourceMappingURL=ImagePlaceholder.js.map

package/Avatar/ImagePlaceholder.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ImagePlaceholder.js","sourceRoot":"","sources":["../../src/Avatar/ImagePlaceholder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAU3B,MAAM,gBAAgB,GAAG,CAAC,EACxB,IAAI,EACJ,OAAO,EACP,SAAS,EACT,OAAO,EACe,EAAE,EAAE;IAC1B,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,aAAa,EACrB,OAAO,CAAC,OAAO,CAAC,EAChB,OAAO,CAAC,IAAI,CAAC,EACb,OAAO,CAAC,aAAa,EACrB,SAAS,CACV,GACD,CACH,CAAA;AACH,CAAC,CAAA;AAED,eAAe,gBAAgB,CAAA"}

package/Avatar/InitialsAvatar.d.ts

@@ -1,10 +0,0 @@
-import { JssProps } from '@toptal/picasso-shared';
-import type { VariantType, AvatarSizeType } from './Avatar';
-declare type WithInitialsProps = {
-    name: string;
-    variant: VariantType;
-    size: AvatarSizeType;
-    className?: string;
-} & JssProps;
-declare const WithInitials: ({ classes, name, variant, size, className }: WithInitialsProps) => JSX.Element;
-export default WithInitials;

package/Avatar/InitialsAvatar.js

@@ -1,16 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import { Typography } from '..';
-import ImagePlaceholder from './ImagePlaceholder';
-import getNameInitials from '../utils/get-name-initials';
-import { AVATAR_INITIALS_LIMIT } from '../utils/constants';
-const WithInitials = ({ classes, name, variant, size, className }) => {
-    const initials = getNameInitials(name);
-    return (React.createElement(React.Fragment, null,
-        React.createElement(ImagePlaceholder, { variant: variant, size: size, className: className, classes: classes }),
-        React.createElement(Typography, { className: cx(classes.text, classes.centeredContent, {
-                [classes.textCapLimit]: initials.length >= AVATAR_INITIALS_LIMIT
-            }), invert: true }, initials)));
-};
-export default WithInitials;
-//# sourceMappingURL=InitialsAvatar.js.map

package/Avatar/InitialsAvatar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InitialsAvatar.js","sourceRoot":"","sources":["../../src/Avatar/InitialsAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAE,MAAM,IAAI,CAAA;AAC/B,OAAO,gBAAgB,MAAM,oBAAoB,CAAA;AACjD,OAAO,eAAe,MAAM,4BAA4B,CAAA;AACxD,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAS1D,MAAM,YAAY,GAAG,CAAC,EACpB,OAAO,EACP,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,SAAS,EACS,EAAE,EAAE;IACtB,MAAM,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,CAAA;IAEtC,OAAO,CACL;QACE,oBAAC,gBAAgB,IACf,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB;QACF,oBAAC,UAAU,IACT,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,eAAe,EAAE;gBACnD,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,QAAQ,CAAC,MAAM,IAAI,qBAAqB;aACjE,CAAC,EACF,MAAM,UAEL,QAAQ,CACE,CACZ,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,YAAY,CAAA"}

package/Avatar/styles.d.ts

@@ -1,3 +0,0 @@
-import { Theme } from '@material-ui/core/styles';
-declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<{}, "medium" | "text" | "large" | "small" | "square" | "root" | "image" | "xxsmall" | "xsmall" | "portrait" | "landscape" | "clippedCorner" | "textContainer" | "centeredContent" | "textCapLimit" | "logoContainer" | "logo" | "xxsmalLIcon" | "xsmallIcon" | "smallIcon" | "mediumIcon" | "largeIcon">;
-export default _default;

package/Avatar/styles.js

@@ -1,77 +0,0 @@
-import { createStyles } from '@material-ui/core/styles';
-import { rem } from '@toptal/picasso-shared';
-const getClipPathCornerMask = (cornerWidth) => `polygon(0 0, 100% 0, 100% 100%, ${cornerWidth} 100%, 0 calc(100% - ${cornerWidth}))`;
-const CLIPPED_CORNER_SIZE_EM = 0.5;
-const LOGO_SIZE_EM = 0.5;
-export default ({ palette }) => createStyles({
-    root: {
-        position: 'relative'
-    },
-    image: {
-        objectFit: 'cover'
-    },
-    square: {
-        width: '2.5em',
-        height: '2.5em'
-    },
-    portrait: {
-        width: '1.666em',
-        height: '2.5em'
-    },
-    landscape: {
-        width: '2.5em',
-        height: '1.666em'
-    },
-    xxsmall: {
-        fontSize: '0.8rem'
-    },
-    xsmall: {
-        fontSize: '1rem'
-    },
-    small: {
-        fontSize: '2rem'
-    },
-    medium: {
-        fontSize: '3rem'
-    },
-    large: {
-        fontSize: '4.5rem'
-    },
-    clippedCorner: {
-        clipPath: getClipPathCornerMask(`${CLIPPED_CORNER_SIZE_EM}em`),
-        // we can remove this prefix as soon as this issue will
-        // be resolved - https://github.com/cssinjs/css-vendor/issues/74
-        '-webkit-clip-path': getClipPathCornerMask(`${CLIPPED_CORNER_SIZE_EM}em`)
-    },
-    textContainer: {
-        backgroundColor: palette.grey.main
-    },
-    text: {
-        fontSize: '1em',
-        textTransform: 'uppercase'
-    },
-    centeredContent: {
-        position: 'absolute',
-        top: '50%',
-        left: '50%',
-        transform: 'translate(-50%, -50%)'
-    },
-    textCapLimit: {
-        fontSize: '0.85em'
-    },
-    logoContainer: {
-        display: 'flex',
-        position: 'absolute',
-        bottom: `${CLIPPED_CORNER_SIZE_EM * 0.8}em`,
-        left: `${CLIPPED_CORNER_SIZE_EM * 0.8}em`
-    },
-    logo: {
-        fontSize: `${LOGO_SIZE_EM}em`
-    },
-    xxsmalLIcon: { fontSize: '1rem' },
-    xsmallIcon: { fontSize: '1rem' },
-    smallIcon: { fontSize: rem('24px') },
-    mediumIcon: { fontSize: rem('30px') },
-    largeIcon: { fontSize: rem('48px') }
-});
-//# sourceMappingURL=styles.js.map

package/Avatar/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/Avatar/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAE5C,MAAM,qBAAqB,GAAG,CAAC,WAAmB,EAAE,EAAE,CACpD,mCAAmC,WAAW,wBAAwB,WAAW,IAAI,CAAA;AAEvF,MAAM,sBAAsB,GAAG,GAAG,CAAA;AAClC,MAAM,YAAY,GAAG,GAAG,CAAA;AAExB,eAAe,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE,CACpC,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,QAAQ,EAAE,UAAU;KACrB;IACD,KAAK,EAAE;QACL,SAAS,EAAE,OAAO;KACnB;IACD,MAAM,EAAE;QACN,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,OAAO;KAChB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,OAAO;KAChB;IACD,SAAS,EAAE;QACT,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,SAAS;KAClB;IACD,OAAO,EAAE;QACP,QAAQ,EAAE,QAAQ;KACnB;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;KACjB;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM;KACjB;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;KACjB;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,QAAQ;KACnB;IACD,aAAa,EAAE;QACb,QAAQ,EAAE,qBAAqB,CAAC,GAAG,sBAAsB,IAAI,CAAC;QAC9D,uDAAuD;QACvD,gEAAgE;QAChE,mBAAmB,EAAE,qBAAqB,CAAC,GAAG,sBAAsB,IAAI,CAAC;KAC1E;IACD,aAAa,EAAE;QACb,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;KACnC;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,KAAK;QACf,aAAa,EAAE,WAAW;KAC3B;IACD,eAAe,EAAE;QACf,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,KAAK;QACV,IAAI,EAAE,KAAK;QACX,SAAS,EAAE,uBAAuB;KACnC;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,QAAQ;KACnB;IACD,aAAa,EAAE;QACb,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,GAAG,sBAAsB,GAAG,GAAG,IAAI;QAC3C,IAAI,EAAE,GAAG,sBAAsB,GAAG,GAAG,IAAI;KAC1C;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,GAAG,YAAY,IAAI;KAC9B;IACD,WAAW,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE;IACjC,UAAU,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE;IAChC,SAAS,EAAE,EAAE,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC,EAAE;IACpC,UAAU,EAAE,EAAE,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC,EAAE;IACrC,SAAS,EAAE,EAAE,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC,EAAE;CACrC,CAAC,CAAA"}