@transferwise/components 46.107.0 → 46.108.0

package/build/types/link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/link/Link.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEhF,OAAO,EAAE,SAAS,EAAE,WAAW,EAAc,MAAM,WAAW,CAAC;AAI/D,MAAM,MAAM,KAAK,GAAG,oBAAoB,GACtC,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;CAAE,CAAC;AAE7E;;;;GAIG;AACH,QAAA,MAAM,IAAI,GAAI,yFASX,KAAK,gCAoCP,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/link/Link.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEhF,OAAO,EAAE,SAAS,EAAE,WAAW,EAAc,MAAM,WAAW,CAAC;AAI/D,MAAM,MAAM,KAAK,GAAG,oBAAoB,GACtC,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;CAAE,CAAC;AAE7E;;;;GAIG;AACH,QAAA,MAAM,IAAI,GAAI,mGAUX,KAAK,gCAuCP,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/build/types/listItem/ListItem.d.ts

@@ -13,7 +13,16 @@ export type ListItemProps = {
      * Swaps vertical hierarchy of title and subtitle and their corresponding right values.
      */
     inverted?: boolean;
+    /**
+     * Disables the control and renders the ListItem in greyscale and with slightly decreased opacity.
+     */
     disabled?: boolean;
+    /**
+     * If set, it'll extend the `disabled` state, overriding existing or injecting uniquely styled prompt with the message provided via this prop. <br />
+     * **NB:** This message cannot house more than **1** link or inline button.<br />
+     * **NB:** It must be used together with `disabled` prop and will be disregarded otherwise.
+     */
+    disabledPromptMessage?: ReactNode;
     /**
      * Highlights the list item as an action to be taken or already taken. <br />
      */
@@ -61,7 +70,7 @@ export type ListItemProps = {
  * @see [Storybook documentation](https://storybook.wise.design/?path=/docs/content-listitem--docs)
  */
 export declare const ListItem: {
-    ({ as: ListItemElement, title, subtitle, additionalInfo, prompt, inverted, media, spotlight, valueTitle, valueSubtitle, control, disabled, className, valueColumnWidth, id, }: ListItemProps): import("react").JSX.Element;
+    ({ as: ListItemElement, title, subtitle, additionalInfo, prompt, inverted, media, spotlight, valueTitle, valueSubtitle, control, disabled, disabledPromptMessage, className, valueColumnWidth, id, }: ListItemProps): import("react").JSX.Element;
     Image: {
         ({ alt, size, className, ...props }: import("./Image").ListItemImageProps): import("react").JSX.Element;
         displayName: string;

package/build/types/listItem/ListItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAc,KAAK,uBAAuB,EAAE,MAAM,cAAc,CAAC;AACxE,OAAO,EAAY,KAAK,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAClE,OAAO,EAAc,KAAK,uBAAuB,EAAE,MAAM,cAAc,CAAC;AAExE,OAAO,EAAU,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC5D,OAAO,EAAS,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,EAAU,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAY5D,MAAM,MAAM,aAAa,GACrB,iBAAiB,GACjB,YAAY,GACZ,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,aAAa,CAAC;AAElB,MAAM,MAAM,oBAAoB,GAC5B,uBAAuB,GACvB,qBAAqB,GACrB,mBAAmB,GACnB,uBAAuB,GACvB,kBAAkB,GAClB,mBAAmB,CAAC;AAExB,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,QAAQ;mLAgBlB,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmOf,CAAC;AAgGF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAc,KAAK,uBAAuB,EAAE,MAAM,cAAc,CAAC;AACxE,OAAO,EAAY,KAAK,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAClE,OAAO,EAAc,KAAK,uBAAuB,EAAE,MAAM,cAAc,CAAC;AAExE,OAAO,EAAU,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC5D,OAAO,EAAS,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,EAAU,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAY5D,MAAM,MAAM,aAAa,GACrB,iBAAiB,GACjB,YAAY,GACZ,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,aAAa,CAAC;AAElB,MAAM,MAAM,oBAAoB,GAC5B,uBAAuB,GACvB,qBAAqB,GACrB,mBAAmB,GACnB,uBAAuB,GACvB,kBAAkB,GAClB,mBAAmB,CAAC;AAExB,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,CAAC,EAAE,IAAI,GAAG,KAAK,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,SAAS,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,QAAQ;0MAiBlB,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsOf,CAAC;AA6GF,eAAe,QAAQ,CAAC"}

package/build/types/listItem/ListItemContext.d.ts

@@ -13,8 +13,9 @@ export type ListItemContextData = {
         control: string;
         prompt?: string;
     };
-    props: Pick<ListItemProps, 'disabled' | 'inverted'>;
+    props: Pick<ListItemProps, 'disabled' | 'inverted' | 'disabledPromptMessage'>;
     mediaSize?: ListItemMediaSize;
+    isPartiallyInteractive?: boolean;
     describedByIds: string;
 };
 export declare const ListItemContext: import("react").Context<ListItemContextData>;

package/build/types/listItem/ListItemContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemContext.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAErF,MAAM,MAAM,iBAAiB,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvD,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,eAAe,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,iBAAiB,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,GAAG,EAAE;QACH,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,KAAK,EAAE,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,UAAU,CAAC,CAAC;IACpD,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,eAAe,8CAE3B,CAAC"}
+{"version":3,"file":"ListItemContext.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAErF,MAAM,MAAM,iBAAiB,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEvD,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,eAAe,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,iBAAiB,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,GAAG,EAAE;QACH,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,KAAK,EAAE,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,UAAU,GAAG,uBAAuB,CAAC,CAAC;IAC9E,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,eAAe,8CAE3B,CAAC"}

package/build/types/listItem/Navigation/ListItemNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemNavigation.d.ts","sourceRoot":"","sources":["../../../../src/listItem/Navigation/ListItemNavigation.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAM7D,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAC,CAAC;AAEvF;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU;yBAA2C,uBAAuB;;CAmBxF,CAAC"}
+{"version":3,"file":"ListItemNavigation.d.ts","sourceRoot":"","sources":["../../../../src/listItem/Navigation/ListItemNavigation.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAM7D,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAC,CAAC;AAEvF;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU;yBAA2C,uBAAuB;;CAkBxF,CAAC"}

package/build/types/listItem/Prompt/InlinePrompt/InlinePrompt.d.ts

@@ -0,0 +1,15 @@
+import { Sentiment } from '../../../common';
+export type InlinePromptProps = {
+    sentiment?: `${Sentiment.POSITIVE | Sentiment.NEGATIVE | Sentiment.NEUTRAL | Sentiment.WARNING}`;
+    loading?: boolean;
+    /**
+     * Use for short-lived inline prompts to avoid swap of the icon (which is bad UX for short-lived prompts, e.g. when submit form)
+     */
+    muted?: boolean;
+    id?: string;
+    className?: string;
+    'data-testid'?: string;
+    children: React.ReactNode;
+};
+export declare const InlinePrompt: ({ sentiment, muted, loading, className, children, ...rest }: InlinePromptProps) => import("react").JSX.Element;
+//# sourceMappingURL=InlinePrompt.d.ts.map

package/build/types/listItem/Prompt/InlinePrompt/InlinePrompt.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlinePrompt.d.ts","sourceRoot":"","sources":["../../../../../src/listItem/Prompt/InlinePrompt/InlinePrompt.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAO5C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,GAAG,SAAS,CAAC,QAAQ,GAAG,SAAS,CAAC,QAAQ,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC;IACjG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,6DAO1B,iBAAiB,gCA4BnB,CAAC"}

package/build/types/listItem/Prompt/InlinePrompt/index.d.ts

@@ -0,0 +1,3 @@
+export type { InlinePromptProps } from './InlinePrompt';
+export { InlinePrompt } from './InlinePrompt';
+//# sourceMappingURL=index.d.ts.map

package/build/types/listItem/Prompt/InlinePrompt/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/listItem/Prompt/InlinePrompt/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/build/types/listItem/Prompt/ListItemPrompt.d.ts

@@ -1,10 +1,8 @@
-import { Sentiment } from '../../common';
-export type ListItemPromptProps = {
-    sentiment?: `${Sentiment.POSITIVE | Sentiment.NEGATIVE | Sentiment.NEUTRAL | Sentiment.WARNING}`;
-    children: React.ReactNode;
-};
+import { type InlinePromptProps } from './InlinePrompt';
+export type ListItemPromptProps = Pick<InlinePromptProps, 'children' | 'sentiment' | 'muted'>;
 /**
- * This component allows for rendering an Inline Prompt. <br />In the future it will be a thin wrapper around a standalone component.<br />
+ * This component allows for rendering an Inline Prompt. <br />
+ * In the future it will be a thin wrapper around a standalone component.<br />
  *
  * Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.
  */

package/build/types/listItem/Prompt/ListItemPrompt.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemPrompt.d.ts","sourceRoot":"","sources":["../../../../src/listItem/Prompt/ListItemPrompt.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzC,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,GAAG,SAAS,CAAC,QAAQ,GAAG,SAAS,CAAC,QAAQ,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC;IACjG,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,MAAM;8BAAiD,mBAAmB;;CAWtF,CAAC;AAGF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"ListItemPrompt.d.ts","sourceRoot":"","sources":["../../../../src/listItem/Prompt/ListItemPrompt.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEtE,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC,CAAC;AAE9F;;;;;GAKG;AACH,eAAO,MAAM,MAAM;8BAAiD,mBAAmB;;CActF,CAAC;AAGF,eAAe,MAAM,CAAC"}

package/build/types/listItem/_stories/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/listItem/_stories/helpers.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD,KAAK,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;AAErC;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,GAAI,QAAQ,KAAK,KAAG,KAuBvD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,SAQxB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC5B,OAAM,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAgB,EAAE,gBAAa,KAAG,SAoBvE,CAAC;AAEJ;;GAEG;AACH,eAAO,MAAM,eAAe,GACzB,kBAAiB,MAAM,EAAO,MAC9B,iBAAgB,MAAM,EAAO;;;;;;CAG7B,CAAC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../../src/listItem/_stories/helpers.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD,KAAK,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;AAErC;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,GAAI,QAAQ,KAAK,KAAG,KAuBvD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,SASxB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC5B,OAAM,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAgB,EAAE,gBAAa,KAAG,SAoBvE,CAAC;AAEJ;;GAEG;AACH,eAAO,MAAM,eAAe,GACzB,kBAAiB,MAAM,EAAO,MAC9B,iBAAgB,MAAM,EAAO;;;;;;CAG7B,CAAC"}

package/build/types/listItem/_stories/subcomponents.d.ts

@@ -20,6 +20,7 @@ export declare const SB_LIST_ITEM_PROMPTS: {
 };
 export declare const SB_LIST_ITEM_MEDIA: {
     readonly image: import("react").JSX.Element;
+    readonly avatarFlag: import("react").JSX.Element;
     readonly avatarSingle: import("react").JSX.Element;
     readonly avatarDouble: import("react").JSX.Element;
     readonly avatarDiagonal: import("react").JSX.Element;

package/build/types/listItem/_stories/subcomponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"subcomponents.d.ts","sourceRoot":"","sources":["../../../../src/listItem/_stories/subcomponents.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQlC,MAAM,MAAM,uBAAuB,GAC/B,iBAAiB,GACjB,QAAQ,GACR,cAAc,GACd,eAAe,GACf,qBAAqB,GACrB,YAAY,GACZ,kBAAkB,GAClB,qBAAqB,GACrB,2BAA2B,GAC3B,mBAAmB,GACnB,yBAAyB,GACzB,4BAA4B,GAC5B,kCAAkC,GAClC,YAAY,GACZ,oBAAoB,GACpB,UAAU,GACV,OAAO,GACP,QAAQ,CAAC;AAEb,eAAO,MAAM,iBAAiB;;;;;;;;CAgB7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,uBAAuB,EAAE,SAAS,CA2DnE,CAAC;AAEX,eAAO,MAAM,4BAA4B;;;CAe/B,CAAC;AAEX,eAAO,MAAM,oBAAoB;;;CAavB,CAAC;AAEX,eAAO,MAAM,kBAAkB;;;;;CAoBrB,CAAC"}
+{"version":3,"file":"subcomponents.d.ts","sourceRoot":"","sources":["../../../../src/listItem/_stories/subcomponents.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQlC,MAAM,MAAM,uBAAuB,GAC/B,iBAAiB,GACjB,QAAQ,GACR,cAAc,GACd,eAAe,GACf,qBAAqB,GACrB,YAAY,GACZ,kBAAkB,GAClB,qBAAqB,GACrB,2BAA2B,GAC3B,mBAAmB,GACnB,yBAAyB,GACzB,4BAA4B,GAC5B,kCAAkC,GAClC,YAAY,GACZ,oBAAoB,GACpB,UAAU,GACV,OAAO,GACP,QAAQ,CAAC;AAEb,eAAO,MAAM,iBAAiB;;;;;;;;CAgB7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,uBAAuB,EAAE,SAAS,CA2DnE,CAAC;AAEX,eAAO,MAAM,4BAA4B;;;CAe/B,CAAC;AAEX,eAAO,MAAM,oBAAoB;;;CAavB,CAAC;AAEX,eAAO,MAAM,kBAAkB;;;;;;CAyBrB,CAAC"}

package/build/types/listItem/useListItemControl.d.ts

@@ -1,5 +1,5 @@
 import type { ListItemTypes, ListItemControlProps } from './ListItem';
 export declare function useListItemControl(controlType: ListItemTypes, controlProps: ListItemControlProps): {
-    baseItemProps: Pick<import("./ListItem").ListItemProps, "disabled" | "inverted">;
+    baseItemProps: Pick<import("./ListItem").ListItemProps, "disabled" | "inverted" | "disabledPromptMessage">;
 };
 //# sourceMappingURL=useListItemControl.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "46.107.0",
+  "version": "46.108.0",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -84,9 +84,9 @@
     "storybook-addon-tag-badges": "^2.0.2",
     "storybook-addon-test-codegen": "^2.0.1",
     "@transferwise/less-config": "3.1.2",
+    "@transferwise/neptune-css": "14.24.6",
     "@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.4",

package/src/header/Header.story.tsx

@@ -98,6 +98,7 @@ export const Playground: Story = {
       'aria-label': 'Action',
       text: 'Click me',
       onClick: () => alert('Action clicked!'),
+      disabled: false,
     },
   },
 };
@@ -133,6 +134,19 @@ export const ActionAsLink: Story = {
   argTypes: hideControls(['as', 'className', 'level', 'title', 'testId']),
 };
 
+export const DisabledAction: Story = {
+  args: {
+    title: 'Header with Disabled Action',
+    action: {
+      'aria-label': 'Disabled action',
+      text: 'Disabled Action',
+      onClick: () => alert('This should not fire!'),
+      disabled: true,
+    },
+  },
+  argTypes: hideControls(['as', 'className', 'level', 'title', 'testId']),
+};
+
 /**
  * Demonstrates a `Header` rendered as a custom HTML element.
  */

package/src/header/Header.tsx

@@ -8,6 +8,7 @@ import React, { useEffect, useRef, FunctionComponent, ReactNode } from 'react';
 type ActionProps = AriaLabelProperty & {
   text: string;
   onClick?: (event: React.MouseEvent) => void;
+  disabled?: boolean;
 };
 
 type ButtonActionProps = ActionProps;
@@ -58,6 +59,7 @@ const HeaderAction = React.forwardRef<
       aria-label={action['aria-label']}
       href={'href' in action ? action.href : undefined}
       target={'target' in action ? action.target : undefined}
+      disabled={action.disabled}
       onClick={action.onClick}
     >
       {action.text}

package/src/link/Link.css

@@ -14,3 +14,10 @@ button.np-link {
   margin-left: 0;
   margin-left: initial;
 }
+.np-link.np-link--disabled,
+.np-link:disabled {
+  filter: none;
+  mix-blend-mode: luminosity;
+  opacity: 0.45;
+  cursor: not-allowed;
+}

package/src/link/Link.less

@@ -11,4 +11,12 @@ a, button.np-link {
     align-items: center;
     .margin(left, var(--size-4));
   }
+
+  &.np-link--disabled,
+  &:disabled {
+    filter: none;
+    mix-blend-mode: luminosity;
+    opacity: 0.45;
+    cursor: not-allowed;
+  }
 }

package/src/link/Link.spec.tsx

@@ -74,4 +74,32 @@ describe('Link', () => {
 
     expect(link).toHaveAttribute('aria-label', 'make me accessible');
   });
+
+  it('renders disabled button with attribute and class', () => {
+    const onClick = jest.fn();
+    render(
+      // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+      <Link disabled onClick={onClick}>
+        button as link
+      </Link>,
+    );
+
+    const link = screen.getByText('button as link');
+    expect(link.tagName).toBe('BUTTON');
+    expect(link).toHaveClass('np-link--disabled');
+    expect(link).toBeDisabled();
+  });
+
+  it('passes disabled attribute to anchor element when rendered as link', () => {
+    render(
+      <Link {...props} disabled>
+        disabled link
+      </Link>,
+    );
+
+    const link = screen.getByText('disabled link');
+
+    expect(link).toHaveClass('np-link--disabled');
+    expect(link.tagName).toBe('A');
+  });
 });

package/src/link/Link.story.tsx

@@ -36,68 +36,124 @@ export const Basic = () => {
       >
         button as Link
       </Link>
+
+      <Title type={Typography.TITLE_SCREEN} className="m-t-3">
+        Disabled links
+      </Title>
+      <Link href="#" disabled className="m-t-3">
+        Disabled link
+      </Link>
+      <Link type={Typography.LINK_LARGE} href="#" disabled className="m-t-3">
+        Disabled large link
+      </Link>
+      {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}
+      <Link className="m-t-3" disabled onClick={() => console.log('click disabled button')}>
+        Disabled button as Link
+      </Link>
+      {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}
+      <Link
+        className="m-t-3"
+        type={Typography.LINK_LARGE}
+        disabled
+        onClick={() => console.log('click disabled button')}
+      >
+        Disabled button as Link (large)
+      </Link>
+
       <Title type={Typography.TITLE_SCREEN} className="m-t-3">
         Links via <code>{'<Link />'}</code> component in all types of body copy
       </Title>
       <Body type={Typography.BODY_LARGE_BOLD} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <Link href="#" target="_blank">
           most international account
         </Link>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_LARGE} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <Link href="#" target="_blank">
           most international account
         </Link>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_DEFAULT_BOLD} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <Link href="#" target="_blank">
           most international account
         </Link>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_DEFAULT} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <Link href="#" target="_blank">
           most international account
         </Link>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
+      </Body>
+
+      <Title type={Typography.TITLE_SCREEN} className="m-t-3">
+        Disabled links in body copy
+      </Title>
+      <Body type={Typography.BODY_LARGE_BOLD} className="m-t-3">
+        We&apos;re building the world&apos;s{' '}
+        <Link href="#" disabled>
+          most international account
+        </Link>
+        . We&apos;re building the world&apos;s most international account
+      </Body>
+      <Body type={Typography.BODY_LARGE} className="m-t-3">
+        We&apos;re building the world&apos;s{' '}
+        <Link href="#" disabled>
+          most international account
+        </Link>
+        . We&apos;re building the world&apos;s most international account
+      </Body>
+      <Body type={Typography.BODY_DEFAULT_BOLD} className="m-t-3">
+        We&apos;re building the world&apos;s{' '}
+        <Link href="#" disabled>
+          most international account
+        </Link>
+        . We&apos;re building the world&apos;s most international account
+      </Body>
+      <Body type={Typography.BODY_DEFAULT} className="m-t-3">
+        We&apos;re building the world&apos;s{' '}
+        <Link href="#" disabled>
+          most international account
+        </Link>
+        . We&apos;re building the world&apos;s most international account
       </Body>
 
       <Title type={Typography.TITLE_SCREEN} className="m-t-3">
         Links via <code>{'<a>'}</code> tag in all types of body copy
       </Title>
       <Body type={Typography.BODY_LARGE_BOLD} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <a href="#" target="_blank">
           most international account
         </a>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_LARGE} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <a href="#" target="_blank">
           most international account
         </a>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_DEFAULT_BOLD} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <a href="#" target="_blank">
           most international account
         </a>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
       <Body type={Typography.BODY_DEFAULT} className="m-t-3">
-        We’re building the world’s{' '}
+        We&apos;re building the world&apos;s{' '}
         <a href="#" target="_blank">
           most international account
         </a>
-        . We’re building the world’s most international account
+        . We&apos;re building the world&apos;s most international account
       </Body>
     </>
   );

package/src/link/Link.tsx

@@ -24,6 +24,7 @@ const Link = ({
   type = Typography.LINK_DEFAULT,
   'aria-label': ariaLabel,
   onClick,
+  disabled,
   ...props
 }: Props) => {
   const { formatMessage } = useIntl();
@@ -35,6 +36,7 @@ const Link = ({
     'd-inline-flex',
     {
       [`np-text-${type}`]: type,
+      'np-link--disabled': disabled,
     },
     className,
   );
@@ -43,7 +45,8 @@ const Link = ({
     <PrimitiveButton
       type="button"
       aria-label={ariaLabel}
-      className={clsx(classNames, 'btn-unstyled', className)}
+      className={clsx(classNames, 'btn-unstyled')}
+      disabled={disabled}
       onClick={onClick}
     >
       {children}
@@ -55,6 +58,7 @@ const Link = ({
       className={classNames}
       aria-label={ariaLabel}
       rel={isBlank ? 'noreferrer' : undefined}
+      disabled={disabled}
       onClick={onClick}
       {...props}
     >