@wise/dynamic-flow-client 3.22.2 → 3.23.0

package/build/main.mjs

@@ -138,12 +138,12 @@ var init_clsx = __esm({
   }
 });
 
-// ../../node_modules/.pnpm/@wise+art@2.15.0_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index-a91e5689.esm.js
+// ../../node_modules/.pnpm/@wise+art@2.16.1_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index-a91e5689.esm.js
 import { useState as useState2, useEffect as useEffect2, forwardRef, Suspense, lazy } from "react";
 import { jsx as jsx17, jsxs as jsxs4, Fragment as Fragment3 } from "react/jsx-runtime";
 var unknownFlagName, Flag, Sizes, ImageSizes, imageSizes, Assets, RenderMode;
 var init_index_a91e5689_esm = __esm({
-  "../../node_modules/.pnpm/@wise+art@2.15.0_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index-a91e5689.esm.js"() {
+  "../../node_modules/.pnpm/@wise+art@2.16.1_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index-a91e5689.esm.js"() {
     "use strict";
     init_clsx();
     unknownFlagName = "wise";
@@ -1455,12 +1455,14 @@ var alertComponentToProps = ({
 });
 
 // src/revamp/renderers/mappers/allOfComponentToProps.ts
-var allOfComponentToProps = ({ control, description, help, title }, children) => ({
+var allOfComponentToProps = ({ control, description, help, icon, image, title }, children) => ({
   type: "form-section",
   children,
   control,
   description,
   help,
+  icon,
+  image,
   title
 });
 
@@ -1485,7 +1487,9 @@ var inputComponentToProps = (component, type) => {
     disabled,
     errors,
     help,
+    icon,
     id,
+    image,
     placeholder,
     required,
     title,
@@ -1502,7 +1506,9 @@ var inputComponentToProps = (component, type) => {
     disabled,
     error: (_a = messages == null ? void 0 : messages.error) != null ? _a : errors == null ? void 0 : errors[0],
     help,
+    icon,
     id,
+    image,
     label: title,
     placeholder,
     required,
@@ -1708,12 +1714,14 @@ var numberInputComponentToProps = (component) => __spreadProps(__spreadValues({}
 });
 
 // src/revamp/renderers/mappers/objectComponentToProps.ts
-var objectComponentToProps = ({ control, description, help, title }, children) => ({
+var objectComponentToProps = ({ control, description, help, icon, image, title }, children) => ({
   type: "form-section",
   children,
   control,
   description,
   help,
+  icon,
+  image,
   title
 });
 
@@ -1740,6 +1748,8 @@ var repeatableComponentToProps = (component, children, editableItemChildren) =>
     description,
     editItemTitle,
     errors,
+    icon,
+    image,
     maxItems,
     minItems,
     summaryDefaults,
@@ -1770,6 +1780,8 @@ var repeatableComponentToProps = (component, children, editableItemChildren) =>
     editableItem: editableItemChildren,
     editItemTitle,
     error: errors == null ? void 0 : errors[0],
+    icon,
+    image,
     items: itemProps,
     maxItems,
     minItems,
@@ -1911,12 +1923,14 @@ var uploadInputComponentToProps = (component) => {
 };
 
 // src/revamp/renderers/mappers/tupleComponentToProps.ts
-var tupleComponentToProps = ({ control, description, help, title }, children) => ({
+var tupleComponentToProps = ({ control, description, help, icon, image, title }, children) => ({
   type: "form-section",
   children,
   control,
   description,
   help,
+  icon,
+  image,
   title
 });
 
@@ -7850,7 +7864,7 @@ var schemaHasValidationMessages = (schema) => Boolean("validationMessages" in sc
 var mapCommonSchemaProps = (schemaMapperProps) => {
   var _a;
   const { uid, schema, required, validationErrors } = schemaMapperProps;
-  const { $id, analyticsId, control, description, keywords, title, hidden } = schema;
+  const { $id, analyticsId, control, description, icon, image, keywords, title, hidden } = schema;
   return __spreadValues(__spreadValues({
     uid,
     id: $id != null ? $id : uid,
@@ -7860,6 +7874,8 @@ var mapCommonSchemaProps = (schemaMapperProps) => {
     disabled: schemaHasDisabled(schema) ? schema.disabled : false,
     errors: isString(validationErrors) ? [validationErrors] : void 0,
     hidden: Boolean(hidden),
+    icon,
+    image,
     keywords,
     required: Boolean(required),
     title,
@@ -7997,6 +8013,8 @@ var createObjectComponent = (objectProps) => {
     displayOrder,
     help,
     hidden,
+    icon,
+    image,
     summariser,
     title
   } = objectProps;
@@ -8009,6 +8027,8 @@ var createObjectComponent = (objectProps) => {
     description,
     help,
     hidden,
+    icon,
+    image,
     title,
     getChildren() {
       return displayOrder.map((propName) => this.componentMap[propName]);
@@ -8107,7 +8127,7 @@ var validateDisplayOrder = ($id, displayOrder, properties, logEvent) => {
 
 // src/revamp/domain/components/AllOfComponent.ts
 var createAllOfComponent = (allOfProps) => {
-  const { uid, analyticsId, components, control, description, help, hidden, title } = allOfProps;
+  const { uid, analyticsId, components, control, description, help, hidden, icon, image, title } = allOfProps;
   return {
     type: "all-of",
     uid,
@@ -8117,6 +8137,8 @@ var createAllOfComponent = (allOfProps) => {
     description,
     help,
     hidden,
+    icon,
+    image,
     title,
     getChildren() {
       return this.components;
@@ -9521,7 +9543,19 @@ var arraySchemaToMultiSelectComponent = (schemaMapperProps, mapperProps) => {
 
 // src/revamp/domain/components/TupleComponent.ts
 var createTupleComponent = (tupleProps) => {
-  const { uid, analyticsId, components, control, description, help, hidden, summariser, title } = tupleProps;
+  const {
+    uid,
+    analyticsId,
+    components,
+    control,
+    description,
+    help,
+    hidden,
+    icon,
+    image,
+    summariser,
+    title
+  } = tupleProps;
   return {
     type: "tuple",
     uid,
@@ -9531,6 +9565,8 @@ var createTupleComponent = (tupleProps) => {
     description,
     help,
     hidden,
+    icon,
+    image,
     title,
     getChildren() {
       return this.components;
@@ -11546,7 +11582,7 @@ var DateInputRenderer_default = DateInputRenderer;
 // ../renderers/src/DecisionRenderer.tsx
 import { NavigationOptionsList, NavigationOption, Header } from "@transferwise/components";
 
-// ../../node_modules/.pnpm/@wise+art@2.15.0_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index.esm.js
+// ../../node_modules/.pnpm/@wise+art@2.16.1_@transferwise+neptune-css@14.19.0_@types+react@18.3.11_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wise/art/dist/index.esm.js
 init_index_a91e5689_esm();
 init_clsx();
 import "react";

package/build/types/revamp/domain/components/AllOfComponent.d.ts

@@ -1,5 +1,6 @@
 import type { Model } from '@wise/dynamic-flow-types/build/next';
 import type { BaseComponent, LocalValue, RepeatableSummary, DomainComponent } from '../types';
+import { Icon, Image } from '@wise/dynamic-flow-types/build/next';
 export type AllOfComponent = BaseComponent & {
     type: 'all-of';
     components: DomainComponent[];
@@ -7,11 +8,13 @@ export type AllOfComponent = BaseComponent & {
     description?: string;
     help?: string;
     hidden: boolean;
+    icon?: Icon;
+    image?: Image;
     title?: string;
     getChildren: () => DomainComponent[];
     getLocalValue: () => LocalValue;
 };
-export declare const createAllOfComponent: (allOfProps: Pick<AllOfComponent, "control" | "description" | "components" | "title" | "help" | "hidden"> & {
+export declare const createAllOfComponent: (allOfProps: Pick<AllOfComponent, "control" | "description" | "components" | "help" | "hidden" | "icon" | "image" | "title"> & {
     uid: string;
     analyticsId?: string;
     summariser: (value: Model | null) => RepeatableSummary;

package/build/types/revamp/domain/components/BooleanInputComponent.d.ts

@@ -8,7 +8,7 @@ export type BooleanInputComponent = InputComponent<boolean> & {
     validationAsyncState: ValidationAsyncState;
     onChange: (value: boolean) => void;
 };
-export declare const createBooleanInputComponent: (booleanInputProps: Pick<BooleanInputComponent, "uid" | "id" | "analyticsId" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "persistedState" | "required" | "title" | "value" | "validationAsyncState"> & {
+export declare const createBooleanInputComponent: (booleanInputProps: Pick<BooleanInputComponent, "uid" | "id" | "analyticsId" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "icon" | "image" | "persistedState" | "required" | "title" | "value" | "validationAsyncState"> & {
     performPersistAsync: PerformPersistAsync | undefined;
     performRefresh: PerformRefresh | undefined;
     performValidationAsync: PerformValidationAsync | undefined;

package/build/types/revamp/domain/components/DateInputComponent.d.ts

@@ -11,7 +11,7 @@ export type DateInputComponent = InputComponent<string | null> & {
     validationAsyncState: ValidationAsyncState;
     onChange: (value: string | null) => void;
 };
-export declare const createDateInputComponent: (textInputProps: Pick<DateInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "help" | "hidden" | "minimumDate" | "maximumDate" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
+export declare const createDateInputComponent: (textInputProps: Pick<DateInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "help" | "hidden" | "icon" | "image" | "minimumDate" | "maximumDate" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
     checks: IsInvalidCheck<string | null>[];
     performPersistAsync: PerformPersistAsync | undefined;
     performRefresh: PerformRefresh | undefined;

package/build/types/revamp/domain/components/IntegerInputComponent.d.ts

@@ -11,7 +11,7 @@ export type IntegerInputComponent = InputComponent<number | null> & {
     validationAsyncState: ValidationAsyncState;
     onChange: (value: number | null) => void;
 };
-export declare const createIntegerInputComponent: (integerInputProps: Pick<IntegerInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "maximum" | "minimum" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
+export declare const createIntegerInputComponent: (integerInputProps: Pick<IntegerInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "icon" | "image" | "maximum" | "minimum" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
     checks: IsInvalidCheck<number | null>[];
     performPersistAsync: PerformPersistAsync | undefined;
     performRefresh: PerformRefresh | undefined;

package/build/types/revamp/domain/components/MultiSelectInputComponent.d.ts

@@ -15,7 +15,7 @@ export type MultiSelectComponent = InputComponent<LocalValueArray | null> & {
     getSelectedChildren: () => DomainComponent[] | null;
     onSelect: (indices: number[]) => void;
 };
-export declare const createMultiSelectComponent: (multiSelectProps: Pick<MultiSelectComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "hidden" | "maxItems" | "minItems" | "required" | "title" | "validationAsyncState"> & {
+export declare const createMultiSelectComponent: (multiSelectProps: Pick<MultiSelectComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "hidden" | "icon" | "image" | "maxItems" | "minItems" | "required" | "title" | "validationAsyncState"> & {
     checks: IsInvalidCheck<LocalValueArray | null>[];
     initialValue: LocalValue;
     options: (SelectInputOption & {

package/build/types/revamp/domain/components/MultiUploadInputComponent.d.ts

@@ -16,7 +16,7 @@ export type MultiUploadInputComponent = InputComponent<File[]> & {
     onDelete: (fileId: string) => Promise<void>;
     onUpload: (file: File, fileId: string) => Promise<void>;
 };
-export declare const createMultiUploadInputComponent: (uploadInputProps: Pick<MultiUploadInputComponent, "uid" | "id" | "accepts" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "format" | "help" | "hidden" | "maxSize" | "minItems" | "maxItems" | "persistedState" | "placeholder" | "required" | "title" | "uploadLabel" | "value"> & {
+export declare const createMultiUploadInputComponent: (uploadInputProps: Pick<MultiUploadInputComponent, "uid" | "id" | "accepts" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "format" | "help" | "hidden" | "icon" | "image" | "maxSize" | "minItems" | "maxItems" | "persistedState" | "placeholder" | "required" | "title" | "uploadLabel" | "value"> & {
     checks: IsInvalidCheck<File[]>[];
     fileChecks: IsInvalidCheck<File>[];
     performPersistAsync: PerformPersistAsync | undefined;

package/build/types/revamp/domain/components/NumberInputComponent.d.ts

@@ -11,7 +11,7 @@ export type NumberInputComponent = InputComponent<number | null> & {
     validationAsyncState: ValidationAsyncState;
     onChange: (value: number | null) => void;
 };
-export declare const createNumberInputComponent: (numberInputProps: Pick<NumberInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "maximum" | "minimum" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
+export declare const createNumberInputComponent: (numberInputProps: Pick<NumberInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "description" | "disabled" | "errors" | "help" | "hidden" | "icon" | "image" | "maximum" | "minimum" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
     checks: IsInvalidCheck<number | null>[];
     performPersistAsync: PerformPersistAsync | undefined;
     performRefresh: PerformRefresh | undefined;

package/build/types/revamp/domain/components/ObjectComponent.d.ts

@@ -5,7 +5,7 @@ export type ObjectComponent = ComponentWithTitle & {
     getChildren: () => DomainComponent[];
     getLocalValue: () => LocalValueObject;
 };
-export declare const createObjectComponent: (objectProps: Pick<ObjectComponent, "control" | "description" | "componentMap" | "title" | "help" | "hidden"> & {
+export declare const createObjectComponent: (objectProps: Pick<ObjectComponent, "control" | "description" | "componentMap" | "help" | "hidden" | "icon" | "image" | "title"> & {
     uid: string;
     analyticsId?: string;
     displayOrder: string[];

package/build/types/revamp/domain/components/RepeatableComponent.d.ts

@@ -20,7 +20,7 @@ export type RepeatableComponent = ComponentWithTitle & {
     onRemove: () => void;
     onSave: () => boolean;
 };
-export declare const createRepeatableComponent: (repeatableProps: Pick<RepeatableComponent, "uid" | "id" | "addItemTitle" | "components" | "control" | "description" | "editItemTitle" | "errors" | "hidden" | "maxItems" | "minItems" | "title"> & {
+export declare const createRepeatableComponent: (repeatableProps: Pick<RepeatableComponent, "uid" | "id" | "addItemTitle" | "components" | "control" | "description" | "editItemTitle" | "errors" | "hidden" | "icon" | "image" | "maxItems" | "minItems" | "title"> & {
     analyticsId?: string;
     checks: IsInvalidCheck<LocalValueArray | null>[];
     summary?: SummarySummariser;

package/build/types/revamp/domain/components/SelectInputComponent.d.ts

@@ -21,7 +21,7 @@ export type SelectInputOption = {
     keywords?: string[];
     disabled: boolean;
 };
-export declare const createSelectInputComponent: (selectProps: Pick<SelectInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "help" | "hidden" | "placeholder" | "required" | "title"> & {
+export declare const createSelectInputComponent: (selectProps: Pick<SelectInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "help" | "hidden" | "icon" | "image" | "placeholder" | "required" | "title"> & {
     initialModel: Model;
     options: (SelectInputOption & {
         component: DomainComponent;

package/build/types/revamp/domain/components/TextInputComponent.d.ts

@@ -12,7 +12,7 @@ export type TextInputComponent = InputComponent<string | null> & {
     validationAsyncState: ValidationAsyncState;
     onChange: (value: string | null) => void;
 };
-export declare const createTextInputComponent: (textInputProps: Pick<TextInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "displayFormat" | "help" | "hidden" | "maxLength" | "minLength" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
+export declare const createTextInputComponent: (textInputProps: Pick<TextInputComponent, "uid" | "id" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "displayFormat" | "help" | "hidden" | "icon" | "image" | "maxLength" | "minLength" | "persistedState" | "placeholder" | "required" | "title" | "value" | "validationAsyncState"> & {
     checks: IsInvalidCheck<string | null>[];
     performPersistAsync: PerformPersistAsync | undefined;
     performValidationAsync: PerformValidationAsync | undefined;

package/build/types/revamp/domain/components/TupleComponent.d.ts

@@ -5,7 +5,7 @@ export type TupleComponent = ComponentWithTitle & {
     getChildren: () => DomainComponent[];
     getLocalValue: () => LocalValueArray;
 };
-export declare const createTupleComponent: (tupleProps: Pick<TupleComponent, "control" | "description" | "components" | "title" | "help" | "hidden"> & {
+export declare const createTupleComponent: (tupleProps: Pick<TupleComponent, "control" | "description" | "components" | "help" | "hidden" | "icon" | "image" | "title"> & {
     uid: string;
     analyticsId?: string;
     summariser: (value: LocalValue | null) => RepeatableSummary;

package/build/types/revamp/domain/components/UploadInputComponent.d.ts

@@ -11,7 +11,7 @@ export type UploadInputComponent = InputComponent<File | null> & {
     validationAsyncState?: undefined;
     onUpload: (value: File | null) => Promise<void>;
 };
-export declare const createUploadInputComponent: (uploadInputProps: Pick<UploadInputComponent, "uid" | "id" | "accepts" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "format" | "help" | "hidden" | "maxSize" | "persistedState" | "placeholder" | "required" | "title" | "value"> & {
+export declare const createUploadInputComponent: (uploadInputProps: Pick<UploadInputComponent, "uid" | "id" | "accepts" | "analyticsId" | "autoComplete" | "control" | "errors" | "description" | "disabled" | "format" | "help" | "hidden" | "icon" | "image" | "maxSize" | "persistedState" | "placeholder" | "required" | "title" | "value"> & {
     checks: IsInvalidCheck<File | null>[];
     performPersistAsync: PerformPersistAsync | undefined;
     performRefresh?: PerformRefresh | undefined;

package/build/types/revamp/domain/mappers/schema/utils/mapCommonSchemaProps.d.ts

@@ -10,6 +10,8 @@ export declare const mapCommonSchemaProps: (schemaMapperProps: SchemaMapperProps
     disabled: boolean;
     errors: string[] | undefined;
     hidden: boolean;
+    icon: import("@wise/dynamic-flow-types/build/next").Icon | undefined;
+    image: import("@wise/dynamic-flow-types/build/next").Image | undefined;
     keywords: string[] | undefined;
     required: boolean;
     title: string | undefined;

package/build/types/revamp/domain/types.d.ts

@@ -60,6 +60,8 @@ export type ComponentWithTitle = BaseComponent & {
     description?: string;
     help?: string;
     hidden: boolean;
+    icon?: Icon;
+    image?: Image;
     title?: string;
 };
 export type InputComponent<V extends LocalValue> = ComponentWithTitle & {

package/build/types/revamp/renderers/mappers/allOfComponentToProps.d.ts

@@ -1,4 +1,4 @@
 import type { ReactNode } from 'react';
 import type { AllOfComponent } from '../../domain/components/AllOfComponent';
 import type { FormSectionRendererProps } from '@wise/dynamic-flow-renderers';
-export declare const allOfComponentToProps: ({ control, description, help, title }: AllOfComponent, children: ReactNode) => FormSectionRendererProps;
+export declare const allOfComponentToProps: ({ control, description, help, icon, image, title }: AllOfComponent, children: ReactNode) => FormSectionRendererProps;

package/build/types/revamp/renderers/mappers/objectComponentToProps.d.ts

@@ -1,4 +1,4 @@
 import type { ReactNode } from 'react';
 import type { ObjectComponent } from '../../domain/components/ObjectComponent';
 import type { FormSectionRendererProps } from '@wise/dynamic-flow-renderers';
-export declare const objectComponentToProps: ({ control, description, help, title }: ObjectComponent, children: ReactNode) => FormSectionRendererProps;
+export declare const objectComponentToProps: ({ control, description, help, icon, image, title }: ObjectComponent, children: ReactNode) => FormSectionRendererProps;

package/build/types/revamp/renderers/mappers/tupleComponentToProps.d.ts

@@ -1,4 +1,4 @@
 import type { ReactNode } from 'react';
 import type { TupleComponent } from '../../domain/components/TupleComponent';
 import { FormSectionRendererProps } from '@wise/dynamic-flow-renderers';
-export declare const tupleComponentToProps: ({ control, description, help, title }: TupleComponent, children: ReactNode) => FormSectionRendererProps;
+export declare const tupleComponentToProps: ({ control, description, help, icon, image, title }: TupleComponent, children: ReactNode) => FormSectionRendererProps;

package/build/types/revamp/renderers/mappers/utils/inputComponentToProps.d.ts

@@ -8,7 +8,9 @@ export declare const inputComponentToProps: <T extends string, V extends LocalVa
     disabled: boolean;
     error: string | undefined;
     help: string | undefined;
+    icon: import("@wise/dynamic-flow-renderers").Icon | undefined;
     id: string;
+    image: import("@wise/dynamic-flow-renderers").Image | undefined;
     label: string | undefined;
     placeholder: string | undefined;
     required: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/dynamic-flow-client",
-  "version": "3.22.2",
+  "version": "3.23.0",
   "description": "Dynamic Flow web client",
   "license": "Apache-2.0",
   "main": "./build/main.min.js",
@@ -34,32 +34,32 @@
     "@babel/preset-react": "7.25.7",
     "@babel/preset-typescript": "7.25.7",
     "@chromatic-com/storybook": "2.0.2",
-    "@formatjs/cli": "^6.2.15",
-    "@storybook/addon-a11y": "^8.3.5",
-    "@storybook/addon-actions": "^8.3.5",
-    "@storybook/addon-essentials": "^8.3.5",
-    "@storybook/addon-interactions": "^8.3.5",
-    "@storybook/addon-links": "^8.3.5",
+    "@formatjs/cli": "^6.3.0",
+    "@storybook/addon-a11y": "^8.3.6",
+    "@storybook/addon-actions": "^8.3.6",
+    "@storybook/addon-essentials": "^8.3.6",
+    "@storybook/addon-interactions": "^8.3.6",
+    "@storybook/addon-links": "^8.3.6",
     "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
-    "@storybook/manager-api": "^8.3.5",
-    "@storybook/react": "^8.3.5",
-    "@storybook/react-webpack5": "^8.3.5",
-    "@storybook/test": "^8.3.5",
-    "@storybook/types": "^8.3.5",
+    "@storybook/manager-api": "^8.3.6",
+    "@storybook/react": "^8.3.6",
+    "@storybook/react-webpack5": "^8.3.6",
+    "@storybook/test": "^8.3.6",
+    "@storybook/types": "^8.3.6",
     "@testing-library/dom": "10.4.0",
-    "@testing-library/jest-dom": "6.5.0",
+    "@testing-library/jest-dom": "6.6.2",
     "@testing-library/react": "16.0.1",
     "@testing-library/user-event": "14.5.2",
     "@transferwise/components": "46.71.3",
     "@transferwise/formatting": "^2.13.0",
     "@transferwise/icons": "3.13.1",
     "@transferwise/neptune-css": "14.19.0",
-    "@types/node": "22.7.5",
+    "@types/node": "22.7.7",
     "@types/jest": "29.5.13",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
     "@types/react-intl": "3.0.0",
-    "@wise/art": "2.15.0",
+    "@wise/art": "2.16.1",
     "@wise/components-theming": "^1.6.0",
     "babel-jest": "29.7.0",
     "esbuild": "0.24.0",
@@ -68,14 +68,14 @@
     "jest-fetch-mock": "^3.0.3",
     "jest-watch-typeahead": "^2.2.2",
     "nanoid": "5.0.7",
-    "npm-run-all2": "6.2.3",
+    "npm-run-all2": "6.2.4",
     "postcss": "^8.4.47",
     "postcss-cli": "^11.0.0",
     "postcss-import": "^15.1.0",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-intl": "6.8.0",
-    "storybook": "^8.3.5",
+    "storybook": "^8.3.6",
     "stylelint": "16.10.0",
     "stylelint-config-standard": "36.0.1",
     "stylelint-no-unsupported-browser-features": "8.0.1",
@@ -101,7 +101,7 @@
     "nanoid": "5.0.7",
     "react-webcam": "^7.2.0",
     "screenfull": "^5.2.0",
-    "@wise/dynamic-flow-types": "2.24.1"
+    "@wise/dynamic-flow-types": "2.25.0"
   },
   "scripts": {
     "dev": "pnpm build:visual-tests && storybook dev -p 3003",