@wise/dynamic-flow-client 0.1.1 → 0.1.3

package/build/flow/fixtures/examples/recipient-update.js

@@ -0,0 +1,250 @@
+var step = {
+    key: 'Examples/Recipient Update',
+    type: 'form',
+    title: 'Edit recipient',
+    actions: [
+        {
+            title: 'Update',
+            url: '/responses/recipientUpdate/?delay=5000',
+            type: 'primary',
+            method: 'PATCH',
+            $id: 'submit'
+        },
+    ],
+    schemas: [
+        {
+            allOf: [
+                {
+                    type: 'object',
+                    displayOrder: ['currency'],
+                    properties: {
+                        currency: {
+                            title: 'Currency',
+                            type: 'string',
+                            analyticsId: 'currency-select',
+                            oneOf: [
+                                {
+                                    title: 'GBP',
+                                    analyticsId: 'GBP',
+                                    icon: {
+                                        name: 'flag-gbp'
+                                    },
+                                    description: 'British pound',
+                                    "const": 'GBP'
+                                },
+                            ],
+                            readOnly: true
+                        }
+                    },
+                    required: []
+                },
+                {
+                    title: 'Bank details',
+                    type: 'object',
+                    analyticsId: 'SortCode',
+                    icon: {
+                        name: 'bank'
+                    },
+                    displayOrder: ['name', 'details', 'address'],
+                    properties: {
+                        name: {
+                            type: 'object',
+                            displayOrder: ['fullName'],
+                            properties: {
+                                fullName: {
+                                    title: 'Full name of the account holder',
+                                    type: 'string',
+                                    disabled: true,
+                                    readOnly: true,
+                                    validationMessages: {
+                                        minLength: 'Name needs to be between 2 and 140 characters long.',
+                                        maxLength: 'Recipient name cannot be longer than 140 characters.',
+                                        pattern: 'This recipient name may contain invalid characters or is not the full name. Please try again.'
+                                    },
+                                    autofillProvider: 'contact',
+                                    autofillKey: 'contact.fullName',
+                                    pattern: "^[0-9A-Za-zÀ-ÖØ-öø-ÿ-_()'*,.]+ +[0-9A-Za-zÀ-ÖØ-öø-ÿ-_()'*,.]+([0-9A-Za-zÀ-ÖØ-öø-ÿ-_()'*,. ]*)$",
+                                    minLength: 2,
+                                    maxLength: 140
+                                }
+                            },
+                            required: []
+                        },
+                        details: {
+                            type: 'object',
+                            displayOrder: ['sortCode', 'accountNumber'],
+                            properties: {
+                                sortCode: {
+                                    title: 'UK sort code',
+                                    type: 'string',
+                                    placeholder: '40-30-20',
+                                    disabled: true,
+                                    readOnly: true,
+                                    validationMessages: {
+                                        pattern: 'Please enter a valid bank code.'
+                                    },
+                                    pattern: '^\\d{2}-?\\d{2}-?\\d{2}$',
+                                    minLength: 6,
+                                    maxLength: 8,
+                                    format: 'numeric',
+                                    displayFormat: '**-**-**'
+                                },
+                                accountNumber: {
+                                    title: 'Account number',
+                                    type: 'string',
+                                    placeholder: '12345678',
+                                    disabled: true,
+                                    readOnly: true,
+                                    validationMessages: {
+                                        minLength: 'Account number is too short.',
+                                        maxLength: 'Account number is too large.',
+                                        pattern: 'Please enter a valid account number.'
+                                    },
+                                    pattern: '[0-9]{8}',
+                                    minLength: 8,
+                                    maxLength: 8,
+                                    format: 'numeric'
+                                }
+                            },
+                            required: []
+                        },
+                        address: {
+                            title: 'Recipient address',
+                            type: 'object',
+                            displayOrder: ['country', 'city', 'firstLine', 'postCode'],
+                            properties: {
+                                country: {
+                                    title: 'Country',
+                                    type: 'string',
+                                    placeholder: 'Choose a country',
+                                    oneOf: [
+                                        { title: 'Argentina', "const": 'AR' },
+                                        { title: 'Brazil', "const": 'BR' },
+                                        { title: 'Canada', "const": 'CA' },
+                                        { title: 'Denmark', "const": 'DK' },
+                                        { title: 'Egypt', "const": 'EG' },
+                                        { title: 'France', "const": 'FR' },
+                                        { title: 'Germany', "const": 'DE' },
+                                        { title: 'Honduras', "const": 'HN' },
+                                        { title: 'Italy', "const": 'IT' },
+                                        { title: 'Japan', "const": 'JP' },
+                                        { title: 'Korea, Republic of', "const": 'KR' },
+                                        { title: 'Liberia', "const": 'LR' },
+                                        { title: 'Morocco', "const": 'MA' },
+                                        { title: 'New Zealand', "const": 'NZ' },
+                                        { title: 'Oman', "const": 'OM' },
+                                        { title: 'Peru', "const": 'PE' },
+                                        { title: 'Qatar', "const": 'QA' },
+                                        { title: 'Russian Federation', "const": 'RU' },
+                                        { title: 'Spain', "const": 'ES' },
+                                        { title: 'Turkey', "const": 'TR' },
+                                        { title: 'United Kingdom of Great Britain and Northern Ireland', "const": 'GB' },
+                                        { title: 'United States of America', "const": 'US' },
+                                        { title: 'Viet Nam', "const": 'VN' },
+                                        { title: 'Yemen', "const": 'YE' },
+                                        { title: 'Zimbabwe', "const": 'ZW' },
+                                    ],
+                                    validationMessages: {
+                                        required: 'Please select a country.'
+                                    },
+                                    autofillProvider: 'contact',
+                                    autofillKey: 'contact.countryCode'
+                                },
+                                city: {
+                                    title: 'City',
+                                    type: 'string',
+                                    autofillProvider: 'contact',
+                                    autofillKey: 'contact.city',
+                                    pattern: '^.{1,255}$',
+                                    minLength: 1,
+                                    maxLength: 255
+                                },
+                                firstLine: {
+                                    title: 'Recipient address',
+                                    type: 'string',
+                                    autofillProvider: 'contact',
+                                    autofillKey: 'contact.firstLine',
+                                    pattern: '^.{1,255}$',
+                                    minLength: 1,
+                                    maxLength: 255
+                                },
+                                postCode: {
+                                    title: 'Post code',
+                                    type: 'string',
+                                    validationMessages: {
+                                        pattern: 'Please specify a valid post code.',
+                                        required: "Please specify the recipient's post code."
+                                    },
+                                    autofillProvider: 'contact',
+                                    autofillKey: 'contact.postalCode',
+                                    pattern: '^.{1,32}$',
+                                    minLength: 1,
+                                    maxLength: 32
+                                }
+                            },
+                            required: ['country', 'city', 'firstLine', 'postCode'],
+                            help: {
+                                markdown: "For legal reasons, we need to ask for the recipient's address (not the bank's address). Don't worry, they won't get any post from us."
+                            }
+                        }
+                    },
+                    required: ['address']
+                },
+            ],
+            $id: 'form'
+        },
+    ],
+    errors: {
+        validation: {
+            address: {
+                country: 'Please select a country.',
+                city: 'Please enter a city.',
+                postCode: 'Please enter a post code.',
+                firstLine: 'Please enter a residential address.'
+            }
+        }
+    },
+    refreshFormUrl: '/steps/recipientUpdate/?refresh',
+    model: {
+        country: 'GB',
+        ownedByCustomer: false,
+        creatorId: 5465158,
+        accountSummary: '(04-00-04) 27832001',
+        active: true,
+        longAccountSummary: 'GBP account ending in 2001',
+        type: 'SortCode',
+        isInternal: false,
+        profileId: 5461759,
+        legalEntityType: 'PERSON',
+        name: {
+            fullName: 'Fergus Jordan'
+        },
+        currency: 'GBP',
+        details: {
+            accountNumber: '27832001',
+            sortCode: '040004',
+            hashedByLooseHashAlgorithm: '5c577703b845c613532bf0e08bbb38ce37644f76af58e1af6fa7447df7041a27'
+        },
+        id: 67912450,
+        hash: 'fe319d809ce8a4f155412afe1b62bc2f1abf6e4af89f762a85a47811f54dab53',
+        commonFieldMap: {
+            bankCodeField: 'sortCode',
+            accountNumberField: 'accountNumber'
+        }
+    },
+    layout: [
+        {
+            schema: {
+                $ref: 'form'
+            },
+            type: 'form'
+        },
+        {
+            type: 'button',
+            action: {
+                $ref: 'submit'
+            }
+        },
+    ]
+};
+export default step;

package/build/flow/fixtures/examples/recipient.d.ts

@@ -0,0 +1,3 @@
+import { Step } from '../../../dynamic-flow-types';
+declare const step: Step;
+export default step;

package/build/flow/fixtures/examples/recipient.js

@@ -0,0 +1,313 @@
+var step = {
+    key: 'Examples/Recipient Creation',
+    type: 'form',
+    title: 'Recipient Creation Example',
+    description: 'A form step with the typical recipient creation form.',
+    actions: [],
+    schemas: [
+        {
+            $id: '#new-recipient',
+            allOf: [
+                {
+                    type: 'object',
+                    displayOrder: ['profileId', 'currency', 'legalEntityType', 'email'],
+                    properties: {
+                        profileId: {
+                            type: 'number',
+                            hidden: true,
+                            "const": 123456789
+                        },
+                        currency: {
+                            title: 'Currency',
+                            type: 'string',
+                            analyticsId: 'currency',
+                            oneOf: [
+                                {
+                                    title: 'EUR',
+                                    analyticsId: 'currency-eur',
+                                    icon: {
+                                        name: 'flag-eur'
+                                    },
+                                    description: 'Euro',
+                                    "const": 'EUR'
+                                },
+                                {
+                                    title: 'GBP',
+                                    analyticsId: 'currency-gbp',
+                                    icon: {
+                                        name: 'flag-gbp'
+                                    },
+                                    description: 'British pound',
+                                    "const": 'GBP'
+                                },
+                                {
+                                    title: 'INR',
+                                    analyticsId: 'currency-inr',
+                                    icon: {
+                                        name: 'flag-inr'
+                                    },
+                                    description: 'Indian rupee',
+                                    "const": 'INR'
+                                },
+                                {
+                                    title: 'USD',
+                                    analyticsId: 'currency-usd',
+                                    icon: {
+                                        name: 'flag-usd'
+                                    },
+                                    description: 'United States dollar',
+                                    "const": 'USD'
+                                },
+                            ],
+                            validationMessages: {
+                                required: 'Please enter currency.'
+                            },
+                            "default": 'EUR',
+                            refreshFormOnChange: true
+                        },
+                        legalEntityType: {
+                            title: 'Select recipient type',
+                            type: 'string',
+                            analyticsId: 'legalEntityType',
+                            oneOf: [
+                                {
+                                    title: 'Person',
+                                    analyticsId: 'legalEntityType-person',
+                                    "const": 'PERSON'
+                                },
+                                {
+                                    title: 'Business',
+                                    analyticsId: 'legalEntityType-business',
+                                    "const": 'INSTITUTION'
+                                },
+                            ],
+                            validationMessages: {
+                                required: 'Please specify the type of recipient.'
+                            },
+                            refreshFormOnChange: true
+                        },
+                        email: {
+                            title: 'Their email',
+                            type: 'string',
+                            analyticsId: 'email',
+                            placeholder: 'example@example.ex',
+                            validationMessages: {
+                                maxLength: 'The email you have entered is too long.',
+                                pattern: 'The email address is invalid.'
+                            },
+                            refreshFormOnChange: true,
+                            autofillProvider: 'contact',
+                            autofillKey: 'contact.email',
+                            refreshFormUrl: '/steps/recipient',
+                            pattern: "\\s*[a-zA-Z0-9.!#$%&'*+\\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+\\s*",
+                            maxLength: 255
+                        }
+                    },
+                    required: ['currency', 'legalEntityType']
+                },
+                {
+                    title: 'Bank details',
+                    analyticsId: 'bank-details',
+                    oneOf: [
+                        {
+                            title: 'Inside Europe',
+                            analyticsId: 'bank-details-europe',
+                            type: 'object',
+                            displayOrder: ['name', 'ownedByCustomer', 'details', 'type'],
+                            properties: {
+                                name: {
+                                    type: 'object',
+                                    displayOrder: ['fullName'],
+                                    properties: {
+                                        fullName: {
+                                            title: 'Full name of the account holder',
+                                            type: 'string',
+                                            validationMessages: {
+                                                minLength: 'Name needs to be between 2 and 140 characters long.',
+                                                maxLength: 'Recipient name cannot be longer than 140 characters.',
+                                                pattern: 'This recipient name contains invalid characters. Please use latin characters only.',
+                                                required: 'Name cannot be empty.'
+                                            },
+                                            autofillProvider: 'contact',
+                                            autofillKey: 'contact.fullName',
+                                            pattern: '^[0-9A-Za-zÀ-ÖØ-öø-ÿ-_()\'*,.%#^@&{}~<>+$"\\[\\]\\\\ ]+$',
+                                            minLength: 2,
+                                            maxLength: 140
+                                        }
+                                    },
+                                    required: ['fullName']
+                                },
+                                ownedByCustomer: {
+                                    title: 'My own Account',
+                                    type: 'boolean',
+                                    hidden: true,
+                                    "const": false
+                                },
+                                details: {
+                                    type: 'object',
+                                    displayOrder: ['bic', 'iban'],
+                                    properties: {
+                                        bic: {
+                                            title: 'Bank code (BIC/SWIFT)',
+                                            type: 'string',
+                                            placeholder: 'BARCGB22XXX',
+                                            hidden: true,
+                                            validationMessages: {
+                                                minLength: 'The BIC you have entered is too short.',
+                                                maxLength: 'The BIC you have entered is too long.',
+                                                pattern: 'Please specify a valid BIC.'
+                                            },
+                                            pattern: '^[A-Za-z]{6}[A-Za-z\\d]{2}([A-Za-z\\d]{3})?$',
+                                            minLength: 8,
+                                            maxLength: 11
+                                        },
+                                        iban: {
+                                            title: 'IBAN',
+                                            type: 'string',
+                                            placeholder: 'DE12345678901234567890',
+                                            displayFormat: '**** **** **** **** **** **** **** ****',
+                                            help: {
+                                                markdown: 'IBANs are long account numbers used by banks for cross-border transfers. Each country structures this number differently, but it always starts with a 2 digit country code (e.g. DE for Germany).'
+                                            },
+                                            validationMessages: {
+                                                minLength: 'The IBAN you have entered is too short.',
+                                                maxLength: 'The IBAN you have entered is too long.',
+                                                pattern: 'Please specify a valid IBAN.',
+                                                required: 'Please specify an IBAN.'
+                                            },
+                                            refreshFormOnChange: true,
+                                            pattern: '^[a-zA-Z]{2}[a-zA-Z0-9 ]{12,40}$',
+                                            minLength: 14,
+                                            maxLength: 42
+                                        }
+                                    },
+                                    required: ['iban']
+                                },
+                                type: {
+                                    title: 'Type',
+                                    type: 'string',
+                                    hidden: true,
+                                    "const": 'Iban'
+                                }
+                            },
+                            required: ['type', 'name', 'details'],
+                            icon: {
+                                name: 'bank'
+                            }
+                        },
+                        {
+                            title: 'Outside Europe',
+                            analyticsId: 'bank-details-outside-europe',
+                            type: 'object',
+                            displayOrder: ['name', 'ownedByCustomer', 'details', 'type'],
+                            properties: {
+                                name: {
+                                    type: 'object',
+                                    displayOrder: ['fullName'],
+                                    properties: {
+                                        fullName: {
+                                            title: 'Full name of the account holder',
+                                            type: 'string',
+                                            validationMessages: {
+                                                minLength: 'Name needs to be between 2 and 140 characters long.',
+                                                maxLength: 'Recipient name cannot be longer than 140 characters.',
+                                                pattern: 'This recipient name contains invalid characters. Please use latin characters only.',
+                                                required: 'Name cannot be empty.'
+                                            },
+                                            autofillProvider: 'contact',
+                                            autofillKey: 'contact.fullName',
+                                            pattern: '^[0-9A-Za-zÀ-ÖØ-öø-ÿ-_()\'*,.%#^@&{}~<>+$"\\[\\]\\\\ ]+$',
+                                            minLength: 2,
+                                            maxLength: 140
+                                        }
+                                    },
+                                    required: ['fullName']
+                                },
+                                ownedByCustomer: {
+                                    title: 'My own Account',
+                                    type: 'boolean',
+                                    hidden: true,
+                                    "const": false
+                                },
+                                details: {
+                                    type: 'object',
+                                    displayOrder: ['bic', 'accountNumber'],
+                                    properties: {
+                                        bic: {
+                                            title: 'SWIFT / BIC code',
+                                            type: 'string',
+                                            placeholder: 'BUKBGB22',
+                                            validationMessages: {
+                                                minLength: 'The BIC you have entered is too short.',
+                                                maxLength: 'The BIC you have entered is too long.',
+                                                pattern: 'Please specify a valid BIC.',
+                                                required: 'Please specify a BIC.'
+                                            },
+                                            pattern: '^[a-zA-Z]{6}(([a-zA-Z0-9]{2})|([a-zA-Z0-9]{5}))$',
+                                            minLength: 8,
+                                            maxLength: 11
+                                        },
+                                        accountNumber: {
+                                            title: 'IBAN / Account Number',
+                                            type: 'string',
+                                            placeholder: '123456789012',
+                                            validationMessages: {
+                                                minLength: 'Account number is too short.',
+                                                maxLength: 'Account number is too large.',
+                                                pattern: 'Please enter a valid account number.',
+                                                required: 'Please enter an IBAN or account number.'
+                                            },
+                                            pattern: '^[a-zA-Z0-9]{4,34}$',
+                                            minLength: 4,
+                                            maxLength: 34
+                                        }
+                                    },
+                                    required: ['bic', 'accountNumber']
+                                },
+                                type: {
+                                    title: 'Type',
+                                    type: 'string',
+                                    hidden: true,
+                                    "const": 'SwiftCode'
+                                }
+                            },
+                            required: ['type', 'name', 'details'],
+                            icon: {
+                                name: 'bank'
+                            },
+                            alert: {
+                                context: 'warning',
+                                markdown: 'To send EUR to this account, we need to use the SWIFT network. It’s slower, so the transfer might take a day or two longer. Also note that intermediary banks and your recipient’s bank might charge extra fees to the amount received.'
+                            }
+                        },
+                    ],
+                    control: 'tab',
+                    placeholder: 'Please select where you are sending to...'
+                },
+            ]
+        },
+    ],
+    refreshFormUrl: '/steps/recipient',
+    layout: [
+        {
+            type: 'form',
+            schema: {
+                $ref: '#new-recipient'
+            }
+        },
+        {
+            type: 'button',
+            action: {
+                type: 'primary',
+                title: 'Confirm',
+                url: '/v2/accounts',
+                method: 'POST'
+            }
+        },
+    ],
+    model: {
+        ownedByCustomer: false,
+        details: {}
+    }
+};
+export default step;

package/build/flow/fixtures/examples/single-file-upload.d.ts

@@ -0,0 +1,3 @@
+import { Step } from '../../../dynamic-flow-types';
+declare const step: Step;
+export default step;

package/build/flow/fixtures/examples/single-file-upload.js

@@ -0,0 +1,96 @@
+var step = {
+    key: 'Examples/Single File Upload',
+    type: 'form',
+    title: 'Single File Upload Example',
+    actions: [],
+    schemas: [
+        {
+            $id: 'the-schema',
+            type: 'object',
+            displayOrder: ['frontSide'],
+            properties: {
+                frontSide: {
+                    refreshFormOnChange: false,
+                    $id: 'frontSide',
+                    persistAsync: {
+                        url: '/single-file-upload-url',
+                        param: 'file',
+                        idProperty: 'frontSide',
+                        schema: {
+                            accepts: ['image/jpeg', 'image/png'],
+                            maxSize: 41943040,
+                            source: 'file',
+                            description: 'JPEG or PNG less than 10MB',
+                            $id: 'cb22a588-c404-43fd-b3fa-754afb3729f4',
+                            title: 'Upload file',
+                            type: 'blob'
+                        },
+                        method: 'POST'
+                    },
+                    title: 'Single File Upload',
+                    type: 'integer'
+                }
+            },
+            required: ['frontSide']
+        },
+    ],
+    layout: [
+        {
+            type: 'paragraph',
+            text: 'The upload component below uses /single-file-upload-url'
+        },
+        {
+            type: 'form',
+            schema: { $ref: 'the-schema' }
+        },
+        {
+            type: 'paragraph',
+            text: 'The upload component below uses /single-file-upload-url-fail'
+        },
+        {
+            type: 'form',
+            schema: {
+                type: 'object',
+                displayOrder: ['frontSide'],
+                properties: {
+                    frontSide: {
+                        refreshFormOnChange: false,
+                        $id: 'backSide',
+                        persistAsync: {
+                            url: '/single-file-upload-url-fail',
+                            param: 'file',
+                            idProperty: 'backSide',
+                            schema: {
+                                accepts: ['image/jpeg', 'image/png'],
+                                maxSize: 41943040,
+                                source: 'file',
+                                description: 'JPEG or PNG less than 10MB',
+                                $id: 'cb22a588-c404-43fd-b3fa-754afb3729f4',
+                                title: 'Upload file',
+                                type: 'blob'
+                            },
+                            method: 'POST'
+                        },
+                        title: 'Single File Upload',
+                        type: 'integer'
+                    }
+                },
+                required: ['backSide']
+            }
+        },
+        {
+            type: 'button',
+            action: {
+                url: '/submit-uploads',
+                type: 'primary',
+                method: 'POST',
+                disabled: false,
+                title: 'Next'
+            }
+        },
+    ],
+    model: {
+        frontSide: 0
+    }
+};
+export default step;

package/build/flow/fixtures/examples/step-validation-errors.d.ts

@@ -0,0 +1,3 @@
+import { Step } from '../../../dynamic-flow-types';
+declare const step: Step;
+export default step;