@transferwise/components 0.0.0-experimental-eec707b → 0.0.0-experimental-dc27730

package/build/types/avatarWrapper/AvatarWrapper.d.ts

@@ -1,28 +1,18 @@
-import * as React from 'react';
-
-export type AvatarWrapperProfileType = any | any;
-
-export type AvatarWrapperBadgeStatusIcon = any | any | any | any | any;
-
-export interface AvatarWrapperAvatarProps {
-}
-
-export interface AvatarWrapperBadgeProps {
-}
-
-export interface AvatarWrapperProps {
-    url?: string;
-    profileType?: AvatarWrapperProfileType;
-    profileId?: number;
-    badgeUrl?: string;
-    badgeAltText?: string;
-    badgeStatusIcon?: AvatarWrapperBadgeStatusIcon;
-    name?: string;
-    avatarProps?: AvatarWrapperAvatarProps;
-    badgeProps?: AvatarWrapperBadgeProps;
-}
-
-declare const AvatarWrapper: React.FC<AvatarWrapperProps>;
-
-export default AvatarWrapper;
-
+/// <reference types="react" />
+import { AvatarProps } from '../avatar';
+import { BadgeProps } from '../badge';
+import { ProfileTypePersonal, ProfileTypeBusiness, Sentiment } from '../common';
+export interface AvatarWrapperProps {
+    url?: string;
+    profileType?: ProfileTypeBusiness | ProfileTypePersonal;
+    profileId?: string;
+    badgeUrl?: string;
+    badgeAltText?: string;
+    badgeStatusIcon?: Sentiment;
+    name?: string;
+    avatarProps?: AvatarProps;
+    badgeProps?: BadgeProps;
+}
+declare const AvatarWrapper: ({ url, profileType, profileId, badgeUrl, badgeAltText, badgeStatusIcon, name, avatarProps, badgeProps, }: AvatarWrapperProps) => import("react").JSX.Element;
+export default AvatarWrapper;
+//# sourceMappingURL=AvatarWrapper.d.ts.map

package/build/types/avatarWrapper/AvatarWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarWrapper.d.ts","sourceRoot":"","sources":["../../../src/avatarWrapper/AvatarWrapper.js"],"names":[],"mappings":";AA8CA;;;;;;;;;;gCAyDC"}
+{"version":3,"file":"AvatarWrapper.d.ts","sourceRoot":"","sources":["../../../src/avatarWrapper/AvatarWrapper.tsx"],"names":[],"mappings":";AAGA,OAAe,EAAE,WAAW,EAAc,MAAM,WAAW,CAAC;AAC5D,OAAc,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAe,mBAAmB,EAAE,mBAAmB,EAAQ,SAAS,EAAE,MAAM,WAAW,CAAC;AA4BnG,MAAM,WAAW,kBAAkB;IACjC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,mBAAmB,GAAG,mBAAmB,CAAC;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,QAAA,MAAM,aAAa,6GAUhB,kBAAkB,gCA+CpB,CAAC;AAgBF,eAAe,aAAa,CAAC"}

package/build/types/avatarWrapper/index.d.ts

@@ -1,3 +1,3 @@
+import AvatarWrapper from './AvatarWrapper';
 export default AvatarWrapper;
-import AvatarWrapper from "./AvatarWrapper";
 //# sourceMappingURL=index.d.ts.map

package/build/types/avatarWrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/avatarWrapper/index.js"],"names":[],"mappings":""}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/avatarWrapper/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,eAAe,aAAa,CAAC"}

package/build/types/badge/Badge.d.ts

@@ -1,11 +1,11 @@
 import { ReactElement, ReactNode } from 'react';
 import { SizeSmall, SizeMedium, SizeLarge, ThemeDark, ThemeLight, CommonProps } from '../common';
-type Props = {
+export type BadgeProps = {
     badge: ReactNode;
     children: ReactNode;
     size?: SizeSmall | SizeMedium | SizeLarge;
     border?: ThemeDark | ThemeLight;
 } & CommonProps;
-declare const Badge: ({ badge, className, size, border, children, }: Props) => ReactElement;
+declare const Badge: ({ badge, className, size, border, children, }: BadgeProps) => ReactElement;
 export default Badge;
 //# sourceMappingURL=Badge.d.ts.map

package/build/types/badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAGL,SAAS,EACT,UAAU,EACV,SAAS,EACT,SAAS,EACT,UAAU,EACV,WAAW,EACZ,MAAM,WAAW,CAAC;AAEnB,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;IAC1C,MAAM,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CACjC,GAAG,WAAW,CAAC;AAEhB,QAAA,MAAM,KAAK,kDAMR,KAAK,KAAG,YAgBV,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAGL,SAAS,EACT,UAAU,EACV,SAAS,EACT,SAAS,EACT,UAAU,EACV,WAAW,EACZ,MAAM,WAAW,CAAC;AAEnB,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;IAC1C,MAAM,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CACjC,GAAG,WAAW,CAAC;AAEhB,QAAA,MAAM,KAAK,kDAMR,UAAU,KAAG,YAgBf,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/build/types/badge/index.d.ts

@@ -1,2 +1,3 @@
-export { default } from "./Badge";
+export { default } from './Badge';
+export type { BadgeProps } from './Badge';
 //# sourceMappingURL=index.d.ts.map

package/build/types/badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/badge/index.js"],"names":[],"mappings":""}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}

package/build/types/common/index.d.ts

@@ -8,6 +8,7 @@ export * from "./propsValues/typography";
 export * from "./propsValues/width";
 export * from "./propsValues/position";
 export * from "./propsValues/status";
+export * from "./propsValues/profileType";
 export * from "./propsValues/scroll";
 export * from "./locale";
 export * from "./commonProps";
@@ -17,7 +18,6 @@ export { DateMode } from "./propsValues/dateMode";
 export { MonthFormat } from "./propsValues/monthFormat";
 export { Layout } from "./propsValues/layouts";
 export { Sentiment } from "./propsValues/sentiment";
-export { ProfileType } from "./propsValues/profileType";
 export { Variant } from "./propsValues/variant";
 export { MarkdownNodeType } from "./propsValues/markdownNodeType";
 export { FileType } from "./fileType";

package/build/types/common/propsValues/profileType.d.ts

@@ -2,4 +2,6 @@ export declare enum ProfileType {
     BUSINESS = "BUSINESS",
     PERSONAL = "PERSONAL"
 }
+export type ProfileTypeBusiness = 'BUSINESS';
+export type ProfileTypePersonal = 'PERSONAL';
 //# sourceMappingURL=profileType.d.ts.map

package/build/types/common/propsValues/profileType.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"profileType.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/profileType.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;CACtB"}
+{"version":3,"file":"profileType.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/profileType.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;CACtB;AAED,MAAM,MAAM,mBAAmB,GAAG,UAAU,CAAC;AAC7C,MAAM,MAAM,mBAAmB,GAAG,UAAU,CAAC"}

package/build/types/common/propsValues/sentiment.d.ts

@@ -17,4 +17,5 @@ export declare enum Sentiment {
      */
     SUCCESS = "success"
 }
+export type SentimentString = 'negative' | 'neutral' | 'positive' | 'warning' | 'pending' | 'info' | 'error' | 'success';
 //# sourceMappingURL=sentiment.d.ts.map

package/build/types/common/propsValues/sentiment.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sentiment.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/sentiment.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IAEnB;;OAEG;IACH,IAAI,SAAS;IACb;;OAEG;IACH,KAAK,UAAU;IACf;;OAEG;IACH,OAAO,YAAY;CACpB"}
+{"version":3,"file":"sentiment.d.ts","sourceRoot":"","sources":["../../../../src/common/propsValues/sentiment.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,OAAO,YAAY;IAEnB;;OAEG;IACH,IAAI,SAAS;IACb;;OAEG;IACH,KAAK,UAAU;IACf;;OAEG;IACH,OAAO,YAAY;CACpB;AAED,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,SAAS,GACT,UAAU,GACV,SAAS,GACT,SAAS,GACT,MAAM,GACN,OAAO,GACP,SAAS,CAAC"}

package/build/types/image/Image.d.ts

@@ -1,21 +1,17 @@
-import * as React from 'react';
-
-export type ImageLoading = "lazy" | "eager";
-
-export interface ImageProps {
-    id?: string;
-    src: string;
-    alt: string;
-    onLoad?: (...args: any[])=>any;
-    onError?: (...args: any[])=>any;
-    className?: string;
-    loading?: ImageLoading;
-    stretch?: boolean;
-    shrink?: boolean;
-    role?: string;
-}
-
-declare const Image: React.FC<ImageProps>;
-
-export default Image;
-
+/// <reference types="react" />
+export interface ImageProps {
+    alt: string;
+    src: string;
+    id?: string;
+    onLoad?: () => void;
+    onError?: () => void;
+    className?: string;
+    loading?: 'lazy' | 'eager';
+    stretch?: boolean;
+    role?: string;
+    shrink?: boolean;
+}
+export declare const EmptyTransparentImage = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";
+declare const Image: ({ id, src, alt, onLoad, onError, className, loading, stretch, role, shrink, }: ImageProps) => import("react").JSX.Element;
+export default Image;
+//# sourceMappingURL=Image.d.ts.map

package/build/types/image/Image.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/image/Image.js"],"names":[],"mappings":"AAMA;;;;;;;;;;;GAWG;AAEH,iHAC+E;;AAE/E;;;;;;;;;;;gCA8BC;;;;;;;;;;;;;;;;;;;QAkBS,iCAAQ;;QACP,kCAAQ"}
+{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../src/image/Image.tsx"],"names":[],"mappings":";AAKA,MAAM,WAAW,UAAU;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,qBAAqB,+EAC4C,CAAC;AAE/E,QAAA,MAAM,KAAK,kFAWR,UAAU,gCA8BZ,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/build/types/image/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from "./Image";
+export { default } from './Image';
 //# sourceMappingURL=index.d.ts.map

package/build/types/image/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/image/index.js"],"names":[],"mappings":""}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/image/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC"}

package/build/types/inlineAlert/InlineAlert.d.ts

@@ -1,15 +1,12 @@
-import * as React from 'react';
-
-export type InlineAlertType = "positive" | "negative" | "warning" | "neutral" | "success" | "info" | "error";
-
-export interface InlineAlertProps {
-    children: React.ReactNode;
-    className?: string;
-    id?: string;
-    type?: InlineAlertType;
-}
-
-declare const InlineAlert: React.FC<InlineAlertProps>;
-
-export default InlineAlert;
-
+import { ReactNode } from 'react';
+import { Sentiment } from '../common';
+import { SentimentString } from '../common/propsValues/sentiment';
+export interface InlineAlertProps {
+    id?: string;
+    type?: Sentiment | SentimentString;
+    className?: string;
+    children: ReactNode;
+}
+declare const InlineAlert: ({ id, type, className, children }: InlineAlertProps) => import("react").JSX.Element;
+export default InlineAlert;
+//# sourceMappingURL=InlineAlert.d.ts.map

package/build/types/inlineAlert/InlineAlert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InlineAlert.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/InlineAlert.js"],"names":[],"mappings":";AAaA,sEAiCC"}
+{"version":3,"file":"InlineAlert.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/InlineAlert.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAElE,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,SAAS,GAAG,eAAe,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAOD,QAAA,MAAM,WAAW,sCAA2D,gBAAgB,gCAmC3F,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/build/types/inlineAlert/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from "./InlineAlert";
+export { default } from './InlineAlert';
 //# sourceMappingURL=index.d.ts.map

package/build/types/inlineAlert/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/index.js"],"names":[],"mappings":""}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/inlineAlert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC"}

package/build/types/promoCard/PromoCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PromoCard.d.ts","sourceRoot":"","sources":["../../../src/promoCard/PromoCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAW3F,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AACjE,MAAM,MAAM,YAAY,GACpB,EAAE,GACF,WAAW,GACX,QAAQ,GACR,UAAU,GACV,UAAU,GACV,MAAM,GACN,SAAS,GACT,MAAM,GACN,UAAU,GACV,YAAY,GACZ,UAAU,GACV,MAAM,GACN,QAAQ,GACR,KAAK,CAAC;AAEV,MAAM,WAAW,oBAAoB;IACnC,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uDAAuD;IACvD,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,sEAAsE;IACtE,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAEzC,6EAA6E;IAC7E,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,oDAAoD;IACpD,WAAW,EAAE,MAAM,CAAC;IAEpB,wDAAwD;IACxD,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,kBAAmB,SAAQ,oBAAoB;IAC9D;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,wDAAwD;IACxD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,GAAG,CAAC,EAAE,YAAY,CAAC;IAEnB,iEAAiE;IACjE,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,iDAAiD;IACjD,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,MAAM,WAAW,qBAAsB,SAAQ,oBAAoB;IACjE,6DAA6D;IAC7D,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,uDAAuD;IACvD,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,iDAAiD;IACjD,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,gEAAgE;IAChE,IAAI,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAE5B,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,GAAG,CAAC,EAAE,KAAK,CAAC;IACZ,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG,qBAAqB,CAAC;AAExE,MAAM,MAAM,oBAAoB,GAAG,CACjC,KAAK,EAAE,kBAAkB,GAAG,qBAAqB,KAC9C,GAAG,CAAC,OAAO,CAAC;;AA+MjB,wBAAqC"}
+{"version":3,"file":"PromoCard.d.ts","sourceRoot":"","sources":["../../../src/promoCard/PromoCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsE,MAAM,OAAO,CAAC;AAW3F,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AACjE,MAAM,MAAM,YAAY,GACpB,EAAE,GACF,WAAW,GACX,QAAQ,GACR,UAAU,GACV,UAAU,GACV,MAAM,GACN,SAAS,GACT,MAAM,GACN,UAAU,GACV,YAAY,GACZ,UAAU,GACV,MAAM,GACN,QAAQ,GACR,KAAK,CAAC;AAEV,MAAM,WAAW,oBAAoB;IACnC,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uDAAuD;IACvD,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,sEAAsE;IACtE,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAEzC,6EAA6E;IAC7E,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,oDAAoD;IACpD,WAAW,EAAE,MAAM,CAAC;IAEpB,wDAAwD;IACxD,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,kBAAmB,SAAQ,oBAAoB;IAC9D;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,wDAAwD;IACxD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,GAAG,CAAC,EAAE,YAAY,CAAC;IAEnB,iEAAiE;IACjE,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,iDAAiD;IACjD,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,MAAM,WAAW,qBAAsB,SAAQ,oBAAoB;IACjE,6DAA6D;IAC7D,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,uDAAuD;IACvD,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,iDAAiD;IACjD,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,gEAAgE;IAChE,IAAI,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAE5B,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,GAAG,CAAC,EAAE,KAAK,CAAC;IACZ,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG,qBAAqB,CAAC;AAExE,MAAM,MAAM,oBAAoB,GAAG,CACjC,KAAK,EAAE,kBAAkB,GAAG,qBAAqB,KAC9C,GAAG,CAAC,OAAO,CAAC;;AA0MjB,wBAAqC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "0.0.0-experimental-eec707b",
+  "version": "0.0.0-experimental-dc27730",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {

package/src/avatarWrapper/AvatarWrapper.spec.tsx

@@ -0,0 +1,105 @@
+import { BadgeProps } from '../badge';
+import { Sentiment } from '../common';
+import { Size, ProfileType } from '../common';
+import { render, screen } from '../test-utils';
+
+import AvatarWrapper from '.';
+
+const name = 'Elizabeth Alexandra Mary Windsor';
+
+describe('FlowNavigationAvatar', () => {
+  describe('with a name', () => {
+    it('shows the initials for a long name', () => {
+      render(<AvatarWrapper name={name} />);
+
+      expect(screen.getByText('EW')).toBeInTheDocument();
+    });
+
+    it('shows the first letter for a mononym', () => {
+      render(<AvatarWrapper name="Zichaleangeol" />);
+
+      expect(screen.getByText('Z')).toBeInTheDocument();
+    });
+
+    describe('AND profileType', () => {
+      describe('FlowNavigationAvatar', () => {
+        describe('with a name', () => {
+          it('shows the initials for a long name', () => {
+            render(<AvatarWrapper name={name} />);
+
+            expect(screen.getByText('EW')).toBeInTheDocument();
+          });
+
+          it('shows the first letter for a mononym', () => {
+            render(<AvatarWrapper name="Michelangelo" />);
+
+            expect(screen.getByText('M')).toBeInTheDocument();
+          });
+
+          describe('AND profileType', () => {
+            it('renders as BUSINESS profile type with an icon', () => {
+              const { container } = render(
+                <AvatarWrapper name={name} profileType={ProfileType.BUSINESS} />,
+              );
+
+              expect(container.firstChild).toMatchSnapshot();
+            });
+
+            it('renders as PERSONAL profile type with an icon', () => {
+              const { container } = render(
+                <AvatarWrapper name={name} profileType={ProfileType.PERSONAL} />,
+              );
+
+              expect(container.firstChild).toMatchSnapshot();
+            });
+
+            describe('AND avatar url', () => {
+              it('renders the image', () => {
+                const { container } = render(
+                  <AvatarWrapper
+                    url="https://wise.com"
+                    name={name}
+                    profileType={ProfileType.BUSINESS}
+                    avatarProps={{ theme: 'dark' }}
+                  />,
+                );
+
+                expect(container.firstChild).toMatchSnapshot();
+              });
+            });
+          });
+        });
+      });
+
+      describe('with nothing passed', () => {
+        it('renders a personal icon', () => {
+          const { container } = render(<AvatarWrapper />);
+
+          expect(container.firstChild).toMatchSnapshot();
+        });
+      });
+
+      describe('with a badge url passed', () => {
+        it('renders the badge', () => {
+          const { container } = render(
+            <AvatarWrapper
+              badgeUrl="https://badge.com"
+              badgeAltText="badge alt text"
+              badgeProps={{ size: Size.LARGE } as BadgeProps}
+            />,
+          );
+
+          expect(container.firstChild).toMatchSnapshot();
+        });
+      });
+
+      describe('with a badge status icon passed', () => {
+        it('renders the badge', () => {
+          const { container } = render(<AvatarWrapper badgeStatusIcon={Sentiment.POSITIVE} />);
+
+          expect(container.firstChild).toMatchSnapshot();
+        });
+      });
+    });
+  });
+});

package/src/avatarWrapper/AvatarWrapper.story.tsx

@@ -9,50 +9,10 @@ import AvatarWrapper from './AvatarWrapper';
 export default {
   component: AvatarWrapper,
   title: 'Content/AvatarWrapper',
-  argTypes: {
-    profileType: {
-      type: {
-        name: 'enum',
-        value: Object.keys(ProfileType),
-      },
-    },
-    badgeStatusIcon: {
-      type: {
-        name: 'enum',
-        value: [
-          Sentiment.POSITIVE,
-          Sentiment.NEGATIVE,
-          Sentiment.NEUTRAL,
-          Sentiment.WARNING,
-          Sentiment.PENDING,
-        ],
-      },
-    },
-  },
-  tags: ['autodocs'],
 } satisfies Meta<typeof AvatarWrapper>;
 
 type Story = StoryObj<typeof AvatarWrapper>;
 
-export const WithBadgeUrl: Story = {
-  args: {
-    badgeUrl: 'https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg',
-    avatarProps: {
-      outlined: true,
-    },
-  },
-};
-
-export const WithBadgeStatus: Story = {
-  args: {
-    profileType: ProfileType.BUSINESS,
-    badgeStatusIcon: Sentiment.PENDING,
-    avatarProps: {
-      outlined: false,
-    },
-  },
-};
-
 export const All: Story = {
   args: {
     avatarProps: { outlined: true },
@@ -85,7 +45,7 @@ export const All: Story = {
           </div>
           Initials
           <div>
-            <AvatarWrapper name="A A" avatarProps={avatarProps} />
+            <AvatarWrapper name="Any Aname" avatarProps={avatarProps} />
           </div>
           Default
           <div>

package/src/avatarWrapper/{AvatarWrapper.js → AvatarWrapper.tsx}

@@ -1,13 +1,19 @@
 import { Person as ProfileIcon, Briefcase as BriefcaseIcon } from '@transferwise/icons';
-import PropTypes from 'prop-types';
 import { useState, useEffect } from 'react';
 
-import Avatar, { AvatarType } from '../avatar';
-import Badge from '../badge';
-import { ProfileType, Size, Sentiment } from '../common';
+import Avatar, { AvatarProps, AvatarType } from '../avatar';
+import Badge, { BadgeProps } from '../badge';
+import { ProfileType, ProfileTypePersonal, ProfileTypeBusiness, Size, Sentiment } from '../common';
 import StatusIcon from '../statusIcon/StatusIcon';
 
-const OptionalBadge = ({ url, altText, statusIcon, children, ...rest }) => {
+interface OptionalBadgeProps {
+  url?: string;
+  altText?: string;
+  statusIcon?: Sentiment;
+  children: React.ReactNode;
+}
+
+const OptionalBadge = ({ url, altText, statusIcon, children, ...rest }: OptionalBadgeProps) => {
   if (url) {
     return (
       <Badge badge={<img src={url} alt={altText} />} {...rest}>
@@ -22,27 +28,20 @@ const OptionalBadge = ({ url, altText, statusIcon, children, ...rest }) => {
       </Badge>
     );
   }
-  return children;
+  return <>{children}</>;
 };
 
-OptionalBadge.propTypes = {
-  url: PropTypes.string,
-  altText: PropTypes.string,
-  statusIcon: PropTypes.oneOf([
-    Sentiment.POSITIVE,
-    Sentiment.NEGATIVE,
-    Sentiment.NEUTRAL,
-    Sentiment.WARNING,
-    Sentiment.PENDING,
-  ]),
-  children: PropTypes.node.isRequired,
-};
-
-OptionalBadge.defaultProps = {
-  url: undefined,
-  altText: undefined,
-  statusIcon: undefined,
-};
+export interface AvatarWrapperProps {
+  url?: string;
+  profileType?: ProfileTypeBusiness | ProfileTypePersonal;
+  profileId?: string;
+  badgeUrl?: string;
+  badgeAltText?: string;
+  badgeStatusIcon?: Sentiment;
+  name?: string;
+  avatarProps?: AvatarProps;
+  badgeProps?: BadgeProps;
+}
 
 const AvatarWrapper = ({
   url,
@@ -54,7 +53,7 @@ const AvatarWrapper = ({
   name,
   avatarProps,
   badgeProps,
-}) => {
+}: AvatarWrapperProps) => {
   const [hasImageLoadError, setImageLoadError] = useState(false);
   const isBusinessProfile = profileType === ProfileType.BUSINESS;
 
@@ -103,7 +102,7 @@ const AvatarWrapper = ({
   );
 };
 
-function getInitials(name) {
+function getInitials(name: string) {
   const allInitials = name
     .split(' ')
     .map((part) => part[0])
@@ -117,34 +116,4 @@ function getInitials(name) {
   return allInitials[0] + allInitials.slice(-1);
 }
 
-AvatarWrapper.defaultProps = {
-  url: undefined,
-  profileType: undefined,
-  profileId: undefined,
-  badgeUrl: undefined,
-  badgeAltText: undefined,
-  badgeStatusIcon: undefined,
-  name: undefined,
-  avatarProps: {},
-  badgeProps: {},
-};
-
-AvatarWrapper.propTypes = {
-  url: PropTypes.string,
-  profileType: PropTypes.oneOf([ProfileType.PERSONAL, ProfileType.BUSINESS]),
-  profileId: PropTypes.number,
-  badgeUrl: PropTypes.string,
-  badgeAltText: PropTypes.string,
-  badgeStatusIcon: PropTypes.oneOf([
-    Sentiment.POSITIVE,
-    Sentiment.NEGATIVE,
-    Sentiment.NEUTRAL,
-    Sentiment.WARNING,
-    Sentiment.PENDING,
-  ]),
-  name: PropTypes.string,
-  avatarProps: PropTypes.shape({}),
-  badgeProps: PropTypes.shape({}),
-};
-
 export default AvatarWrapper;