@transferwise/components 0.0.0-experimental-5acc778 → 0.0.0-experimental-0ffb1f6

package/build/types/legacylistItem/LegacyListItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LegacyListItem.d.ts","sourceRoot":"","sources":["../../../src/legacylistItem/LegacyListItem.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAInD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAmC3C,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"LegacyListItem.d.ts","sourceRoot":"","sources":["../../../src/legacylistItem/LegacyListItem.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAInD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB,CAAC;AAEF;;;;;;;GAOG;AACH,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAmC3C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/build/types/navigationOption/NavigationOption.d.ts

@@ -1,5 +1,13 @@
 import { OptionProps, ReferenceType } from '../common/Option/Option';
 export type NavigationOptionProps = OptionProps;
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 declare const NavigationOption: import("react").ForwardRefExoticComponent<OptionProps & import("react").RefAttributes<ReferenceType>>;
 export default NavigationOption;
 //# sourceMappingURL=NavigationOption.d.ts.map

package/build/types/navigationOption/NavigationOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationOption.d.ts","sourceRoot":"","sources":["../../../src/navigationOption/NavigationOption.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAErE,MAAM,MAAM,qBAAqB,GAAG,WAAW,CAAC;AAEhD,QAAA,MAAM,gBAAgB,uGA2BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"NavigationOption.d.ts","sourceRoot":"","sources":["../../../src/navigationOption/NavigationOption.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAErE,MAAM,MAAM,qBAAqB,GAAG,WAAW,CAAC;AAEhD;;;;;;;GAOG;AACH,QAAA,MAAM,gBAAgB,uGA2BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/build/types/navigationOptionsList/NavigationOptionsList.d.ts

@@ -2,6 +2,15 @@ import * as React from 'react';
 export interface NavigationOptionListProps {
     children: React.ReactNode;
 }
+/**
+ * @deprecated Please use `<List />` and `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [List source](../list/List.tsx)
+ * @see [ListItem source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 declare const NavigationOptionList: ({ children }: NavigationOptionListProps) => React.JSX.Element;
 export default NavigationOptionList;
 //# sourceMappingURL=NavigationOptionsList.d.ts.map

package/build/types/navigationOptionsList/NavigationOptionsList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationOptionsList.d.ts","sourceRoot":"","sources":["../../../src/navigationOptionsList/NavigationOptionsList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,QAAA,MAAM,oBAAoB,GAAI,cAAc,yBAAyB,sBAUpE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"NavigationOptionsList.d.ts","sourceRoot":"","sources":["../../../src/navigationOptionsList/NavigationOptionsList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;GAQG;AACH,QAAA,MAAM,oBAAoB,GAAI,cAAc,yBAAyB,sBAUpE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/build/types/radioOption/RadioOption.d.ts

@@ -9,6 +9,14 @@ export interface RadioOptionProps<T extends string | number = string> extends Re
     showMediaAtAllSizes?: boolean;
     isContainerAligned?: boolean;
 }
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 declare function RadioOption<T extends string | number = ''>({ 'aria-label': ariaLabel, media, title, content, id, name, checked, onChange, complex, disabled, value, showMediaCircle, showMediaAtAllSizes, isContainerAligned, }: RadioOptionProps<T>): import("react").JSX.Element;
 export default RadioOption;
 //# sourceMappingURL=RadioOption.d.ts.map

package/build/types/radioOption/RadioOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioOption.d.ts","sourceRoot":"","sources":["../../../src/radioOption/RadioOption.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAErE,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,CAClE,SAAQ,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC,CAAC,EACrE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC;IACpE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,iBAAS,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,EAAE,EAAE,EACnD,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,KAAK,EACL,OAAO,EACP,EAAE,EACF,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,KAAe,EACf,eAAe,EACf,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,gBAAgB,CAAC,CAAC,CAAC,+BAyBrB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"RadioOption.d.ts","sourceRoot":"","sources":["../../../src/radioOption/RadioOption.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAErE,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,CAClE,SAAQ,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC,CAAC,EACrE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC;IACpE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED;;;;;;;GAOG;AACH,iBAAS,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,EAAE,EAAE,EACnD,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,KAAK,EACL,OAAO,EACP,EAAE,EACF,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,KAAe,EACf,eAAe,EACf,mBAAmB,EACnB,kBAAkB,GACnB,EAAE,gBAAgB,CAAC,CAAC,CAAC,+BAyBrB;AAED,eAAe,WAAW,CAAC"}

package/build/types/summary/Summary.d.ts

@@ -51,6 +51,14 @@ export interface Props {
      */
     title: ReactNode;
 }
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 declare const Summary: ({ action, as: Element, className, content, description, help, icon, illustration, info, status, title, }: Props) => import("react").JSX.Element;
 export default Summary;
 //# sourceMappingURL=Summary.d.ts.map

package/build/types/summary/Summary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Summary.d.ts","sourceRoot":"","sources":["../../../src/summary/Summary.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,EAEL,UAAU,EACV,aAAa,EACb,aAAa,EAId,MAAM,WAAW,CAAC;AACnB,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAK1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAkB5C,MAAM,WAAW,KAAK;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE;QACL,OAAO,EAAE,SAAS,CAAC;QACnB,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,OAAO,CAAC,CAAC;IACxF;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;IACpD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,QAAA,MAAM,OAAO,GAAI,0GAYd,KAAK,gCA4FP,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Summary.d.ts","sourceRoot":"","sources":["../../../src/summary/Summary.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,EAEL,UAAU,EACV,aAAa,EACb,aAAa,EAId,MAAM,WAAW,CAAC;AACnB,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAK1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAkB5C,MAAM,WAAW,KAAK;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE;QACL,OAAO,EAAE,SAAS,CAAC;QACnB,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,OAAO,CAAC,CAAC;IACxF;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;IACpD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,OAAO,GAAI,0GAYd,KAAK,gCA4FP,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/build/types/switchOption/SwitchOption.d.ts

@@ -12,6 +12,14 @@ export type SwitchOptionProps = {
     title: React.ReactNode;
     'aria-label': string;
 };
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 declare const SwitchOption: ({ checked, complex, content, disabled, id, media, onChange, title, showMediaCircle, showMediaAtAllSizes, isContainerAligned, "aria-label": ariaLabel, }: SwitchOptionProps) => import("react").JSX.Element;
 export default SwitchOption;
 //# sourceMappingURL=SwitchOption.d.ts.map

package/build/types/switchOption/SwitchOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchOption.d.ts","sourceRoot":"","sources":["../../../src/switchOption/SwitchOption.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAUF,QAAA,MAAM,YAAY,GAAI,yJAanB,iBAAiB,gCAoCnB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SwitchOption.d.ts","sourceRoot":"","sources":["../../../src/switchOption/SwitchOption.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAUF;;;;;;;GAOG;AACH,QAAA,MAAM,YAAY,GAAI,yJAanB,iBAAiB,gCAoCnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/build/types/title/Title.d.ts

@@ -1,14 +1,15 @@
-import React from 'react';
+import { LabelHTMLAttributes, LiHTMLAttributes } from 'react';
 import { TitleTypes, Heading } from '../common';
-declare const Title: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLSpanElement | HTMLHeadingElement | HTMLLabelElement> & React.LiHTMLAttributes<HTMLLIElement> & {
+type Props = LabelHTMLAttributes<HTMLHeadingElement | HTMLSpanElement | HTMLLabelElement> & LiHTMLAttributes<HTMLLIElement> & {
     /**
      * Default value will based one `type` prop
      */
-    as?: "span" | "label" | "li" | "legend" | "header" | Heading;
+    as?: 'span' | 'label' | 'li' | 'legend' | 'header' | Heading;
     /**
      * Default value: {@link DEFAULT_TYPE}
      */
     type?: TitleTypes;
-} & React.RefAttributes<HTMLSpanElement | HTMLHeadingElement | HTMLLabelElement>>;
+};
+declare function Title({ as, type, className, ...props }: Props): import("react").JSX.Element;
 export default Title;
 //# sourceMappingURL=Title.d.ts.map

package/build/types/title/Title.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Title.d.ts","sourceRoot":"","sources":["../../../src/title/Title.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAEjF,OAAO,EAAE,UAAU,EAAc,OAAO,EAAE,MAAM,WAAW,CAAC;AAwB5D,QAAA,MAAM,KAAK;IAVP;;OAEG;SACE,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO;IAC5D;;OAEG;WACI,UAAU;iFA0BpB,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Title.d.ts","sourceRoot":"","sources":["../../../src/title/Title.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAa,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,UAAU,EAAc,OAAO,EAAE,MAAM,WAAW,CAAC;AAY5D,KAAK,KAAK,GAAG,mBAAmB,CAAC,kBAAkB,GAAG,eAAe,GAAG,gBAAgB,CAAC,GACvF,gBAAgB,CAAC,aAAa,CAAC,GAAG;IAChC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC7D;;OAEG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEJ,iBAAS,KAAK,CAAC,EAAE,EAAE,EAAE,IAAmB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,+BAUrE;AAED,eAAe,KAAK,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "0.0.0-experimental-5acc778",
+  "version": "0.0.0-experimental-0ffb1f6",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -84,9 +84,9 @@
     "storybook-addon-tag-badges": "^2.0.1",
     "storybook-addon-test-codegen": "^2.0.1",
     "@transferwise/less-config": "3.1.2",
+    "@transferwise/neptune-css": "14.24.5",
     "@wise/components-theming": "1.6.4",
-    "@wise/wds-configs": "0.0.0",
-    "@transferwise/neptune-css": "14.24.5"
+    "@wise/wds-configs": "0.0.0"
   },
   "peerDependencies": {
     "@transferwise/icons": "^3.22.3",

package/src/actionButton/ActionButton.story.tsx

@@ -13,7 +13,7 @@ import ActionButton from './ActionButton';
 export default {
   component: ActionButton,
   title: 'Actions/ActionButton',
-  tags: ['wds:deprecated'],
+  tags: ['deprecated'],
 } satisfies Meta<typeof ActionButton>;
 
 type Story = StoryObj<typeof ActionButton>;

package/src/actionOption/ActionOption.story.tsx

@@ -6,6 +6,9 @@ import { Nudge, Title, Typography } from '..';
 
 import ActionOption from './ActionOption';
 
+/**
+ * > ⚠️ This component is **deprecated** and superseded by the [new ListItem component](?path=/docs/content-listitem--docs) with the [ListItem.Button control](?path=/docs/content-listitem-listitem-button--docs).
+ */
 export default {
   component: ActionOption,
   title: 'Option/ActionOption',
@@ -18,6 +21,7 @@ export default {
     additionalContent:
       'Additional content goes here, this content does not align with the logo and button',
   },
+  tags: ['deprecated'],
 } satisfies Meta<typeof ActionOption>;
 
 type Story = StoryObj<typeof ActionOption>;

package/src/actionOption/ActionOption.tsx

@@ -35,6 +35,14 @@ export type ActionOptionProps = {
 } & CommonProps &
   AriaLabelProperty;
 
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 const ActionOption = ({
   action,
   priority = Priority.PRIMARY,

package/src/avatar/Avatar.story.tsx

@@ -13,7 +13,7 @@ import Avatar, { AvatarType } from '.';
 export default {
   component: Avatar,
   title: 'Content/Avatar',
-  tags: ['wds:deprecated'],
+  tags: ['deprecated'],
 } satisfies Meta<typeof Avatar>;
 
 type Story = StoryObj<typeof Avatar>;

package/src/avatarWrapper/AvatarWrapper.story.tsx

@@ -10,7 +10,7 @@ import AvatarWrapper from './AvatarWrapper';
 export default {
   component: AvatarWrapper,
   title: 'Content/AvatarWrapper',
-  tags: ['wds:deprecated'],
+  tags: ['deprecated'],
 } satisfies Meta<typeof AvatarWrapper>;
 
 type Story = StoryObj<typeof AvatarWrapper>;

package/src/badge/Badge.story.tsx

@@ -9,7 +9,7 @@ import Badge, { type BadgeProps } from './Badge';
 const meta: Meta<typeof Badge> = {
   component: Badge,
   title: 'Content/Badge',
-  tags: ['wds:deprecated'],
+  tags: ['deprecated'],
 };
 
 export default meta;

package/src/button/Button.story.tsx

@@ -152,7 +152,7 @@ const getPropsForPreview = (args: PreviewStoryArgs) => {
 const meta: Meta<typeof Button> = {
   component: Button,
   title: 'Actions/Button',
-  tags: ['wds:new'],
+  tags: ['new'],
   argTypes: {
     v2: {
       table: {

package/src/button/LegacyButton.story.tsx

@@ -25,7 +25,7 @@ const withContainer = (Story: any) => (
 const meta: Meta<typeof LegacyButton> = {
   component: LegacyButton,
   title: 'Actions/Button/Legacy Button',
-  tags: ['wds:deprecated'],
+  tags: ['deprecated'],
   args: {
     size: undefined,
     priority: undefined,

package/src/checkboxOption/CheckboxOption.story.tsx

@@ -5,6 +5,9 @@ import { FastFlag } from '@transferwise/icons';
 import { Nudge, Title, Typography } from '..';
 import CheckboxOption, { type CheckboxOptionProps } from './CheckboxOption';
 
+/**
+ * > ⚠️ This component is **deprecated** and superseded by the [new ListItem component](?path=/docs/content-listitem--docs) with the [ListItem.Checkbox control](?path=/docs/content-listitem-listitem-checkbox--docs).
+ */
 const meta: Meta<typeof CheckboxOption> = {
   component: CheckboxOption,
   title: 'Option/CheckboxOption',
@@ -13,6 +16,7 @@ const meta: Meta<typeof CheckboxOption> = {
       source: { type: 'dynamic' },
     },
   },
+  tags: ['deprecated'],
 };
 
 export default meta;

package/src/checkboxOption/CheckboxOption.tsx

@@ -15,6 +15,14 @@ export type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {
   onChange?: (value: boolean) => void;
 };
 
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 const CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(
   ({ checked, disabled, onChange, ...rest }, reference) => {
     return (

package/src/header/Header.css

@@ -1,41 +1,26 @@
 .np-header {
-  display: grid;
-  grid-template-columns: 1fr auto;
-  grid-column-gap: 24px;
-  grid-column-gap: var(--size-24);
-  -moz-column-gap: 24px;
-       column-gap: 24px;
-  -moz-column-gap: var(--size-24);
-       column-gap: var(--size-24);
-  align-items: center;
-  margin-bottom: 8px;
-  margin-bottom: var(--size-8);
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-end;
   max-width: 100%;
   padding: 8px 0;
   padding: var(--size-8) 0;
-  width: 100%;
-}
-.np-header--group {
-  align-items: flex-end;
   border-bottom: 1px solid rgba(0,0,0,0.10196);
   border-bottom: 1px solid var(--color-border-neutral);
+  margin-bottom: 8px;
+  margin-bottom: var(--size-8);
+  -moz-column-gap: 24px;
+       column-gap: 24px;
+  -moz-column-gap: var(--size-24);
+       column-gap: var(--size-24);
 }
 .np-header__title {
   color: #5d7079;
   color: var(--color-content-secondary);
-  margin: 0;
-}
-.np-header__action {
-  margin: 0;
-  height: 20px;
-  display: flex;
-  align-items: center;
-}
-.np-header__action-button {
-  margin-right: -16px;
 }
-@media (max-width: 320px) {
-  .np-header__action-button {
-    margin-right: -12.5px;
-  }
+.np-header__button {
+  margin-inline: calc(16px * -1);
+  margin-inline: calc(var(--size-16) * -1);
+  margin-bottom: calc(4px * -1);
+  margin-bottom: calc(var(--size-4) * -1);
 }

package/src/header/Header.less

@@ -1,35 +1,20 @@
 .np-header {
-  display: grid;
-  grid-template-columns: 1fr auto;
-  column-gap: var(--size-24);
-  align-items: center;
-  margin-bottom: var(--size-8);
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-end;
   max-width: 100%;
   padding: var(--size-8) 0;
-  width: 100%;
-
-  &--group {
-    align-items: flex-end;
-    border-bottom: 1px solid var(--color-border-neutral);
-  }
+  border-bottom: 1px solid var(--color-border-neutral);
+  margin-bottom: var(--size-8);
 
   &__title {
     color: var(--color-content-secondary);
-    margin: 0;
   }
 
-  &__action {
-    margin: 0;
-    height: 20px;
-    display: flex;
-    align-items: center;
-
-    &-button {
-      margin-right: -16px;
+  column-gap: var(--size-24);
 
-      @media (--screen-400-zoom) {
-        margin-right: -12.5px;
-      }
-    }
+  &__button {
+    margin-inline: calc(var(--size-16) * -1);
+    margin-bottom: calc(var(--size-4) * -1);
   }
 }

package/src/header/Header.spec.tsx

@@ -1,113 +1,95 @@
 import { render, screen, userEvent } from '../test-utils';
-import Header, { HeaderProps } from '.';
 
-describe('Header', () => {
-  const defaultProps: HeaderProps = {
-    title: 'Header title',
-  };
-
-  const renderHeader = (props: Partial<HeaderProps> = {}) => {
-    return render(<Header {...defaultProps} {...props} />);
-  };
+import Header from '.';
 
+describe('Header', () => {
   it('can set header title', () => {
-    renderHeader();
+    render(<Header title="Header title" />);
+
     expect(screen.getByText('Header title')).toBeInTheDocument();
   });
 
   it('can trigger header action', async () => {
     const onHeaderActionClick = jest.fn();
-    renderHeader({
-      action: {
-        text: 'Click me!',
-        onClick: onHeaderActionClick,
-      },
-    });
+
+    render(
+      <Header
+        title="Header title"
+        action={{
+          text: 'Click me!',
+          onClick: onHeaderActionClick,
+        }}
+      />,
+    );
 
     await userEvent.click(screen.getByRole('button', { name: 'Click me!' }));
+
     expect(onHeaderActionClick).toHaveBeenCalledTimes(1);
   });
 
   it('can set aria-label property for header action', async () => {
     const onHeaderActionClick = jest.fn();
-    renderHeader({
-      action: {
-        'aria-label': 'Magic',
-        text: 'Click me!',
-        onClick: onHeaderActionClick,
-      },
-    });
+
+    render(
+      <Header
+        title="Header title"
+        action={{
+          'aria-label': 'Magic',
+          text: 'Click me!',
+          onClick: onHeaderActionClick,
+        }}
+      />,
+    );
 
     await userEvent.click(screen.getByRole('button', { name: 'Magic' }));
+
     expect(onHeaderActionClick).toHaveBeenCalledTimes(1);
   });
 
   it('renders header action as a link when href is provided', () => {
-    renderHeader({
-      action: {
-        'aria-label': 'Click me!',
-        text: 'I am a link',
-        href: 'https://wise.com',
-      },
-    });
+    render(
+      <Header
+        title="Header title"
+        action={{
+          'aria-label': 'Click me!',
+          text: 'I am a link',
+          href: 'https://wise.com',
+        }}
+      />,
+    );
 
     const link = screen.getByRole('link', { name: 'Click me!' });
+
     expect(link).toHaveAttribute('href', 'https://wise.com');
   });
 
   it('renders header with h5 heading tag by default', () => {
-    renderHeader();
+    render(<Header title="Header title" />);
+
     expect(screen.getByRole('heading', { name: 'Header title', level: 5 })).toBeInTheDocument();
   });
 
   it('can render header with specific heading tag', () => {
-    renderHeader({ as: 'h3' });
-    expect(screen.getByRole('heading', { name: 'Header title', level: 3 })).toBeInTheDocument();
-  });
+    render(<Header as="h3" title="Header title" />);
 
-  it('renders header with group level', () => {
-    renderHeader({ level: 'group' });
-    const header = screen.getByRole('heading', { name: 'Header title' });
-    expect(header).toHaveClass('np-header--group');
-  });
-
-  it('warns if Header as legend is not inside a fieldset', () => {
-    const consoleWarnMock = jest.spyOn(console, 'warn').mockImplementation();
-
-    renderHeader({ as: 'legend' });
-
-    expect(consoleWarnMock).toHaveBeenCalledWith(
-      'Legends should be the first child in a fieldset, and this is not possible when including an action',
-    );
-
-    consoleWarnMock.mockRestore();
-  });
-
-  it('does not warn if Header as legend is inside a fieldset', () => {
-    const consoleWarnMock = jest.spyOn(console, 'warn').mockImplementation();
-
-    render(
-      <fieldset>
-        <Header as="legend" title="Header title" />
-      </fieldset>,
-    );
-
-    expect(consoleWarnMock).not.toHaveBeenCalled();
-
-    consoleWarnMock.mockRestore();
+    expect(screen.getByRole('heading', { name: 'Header title', level: 3 })).toBeInTheDocument();
   });
 
   it('runs onClick if specified even when it got href prop', async () => {
     const callback = jest.fn();
-    renderHeader({
-      as: 'h3',
-      action: { text: 'Click me', href: '#', onClick: callback },
-    });
+    render(
+      <Header
+        as="h3"
+        title="Header title"
+        action={{ text: 'Click me', href: '#', onClick: callback }}
+      />,
+    );
 
     const button = screen.getByRole('link', { name: 'Click me' });
     expect(button).toBeInTheDocument();
 
     await userEvent.click(button);
+
     expect(callback).toHaveBeenCalledTimes(1);
   });
 });