@wise/dynamic-flow-client 0.4.0-beta-d2067b.7 → 0.4.0

package/build/step/layoutStep/utils/layout-utils.js

@@ -0,0 +1,222 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+exports.__esModule = true;
+exports.convertStepActionToDynamicAction = exports.convertStepToLayout = void 0;
+function convertStepToLayout(step, _a) {
+    var _b = _a === void 0 ? {} : _a, _c = _b.displayStepTitle, displayStepTitle = _c === void 0 ? true : _c;
+    if (!step || !step.type) {
+        throw new Error('Missing step type');
+    }
+    // This condition is meant as a temporary hack until mobile platforms will be refactored to fully support the layout property
+    if (step.layout) {
+        return addMissingTitleAndDescriptionToStep(step, displayStepTitle);
+    }
+    switch (step.type) {
+        case 'final':
+            return convertFinalStepToDynamicLayout(step);
+        case 'decision':
+            return convertDecisionStepToDynamicLayout(step);
+        case 'form':
+            return convertFormStepToDynamicLayout(step);
+        case 'external':
+            return convertExternalStepToDynamicLayout(step);
+        default:
+            throw new Error('invalid step type');
+    }
+}
+exports.convertStepToLayout = convertStepToLayout;
+function convertCommonComponents(step) {
+    var layout = [];
+    if (step.title) {
+        layout.push(convertStepTitleToDynamicHeading(step.title));
+    }
+    if (step.image) {
+        var image = convertStepImageToDynamicImage(step.image);
+        layout.push(image);
+    }
+    if (step.description) {
+        layout.push(convertStepDescriptionToDynamicParagraph(step.description));
+    }
+    return layout;
+}
+function convertExternalStepToDynamicLayout(step) {
+    return __spreadArray(__spreadArray([], convertCommonComponents(step), true), [convertStepToExternalComponent(step)], false);
+}
+function convertStepToExternalComponent(step) {
+    return {
+        type: 'external',
+        requestUrl: step.requestUrl,
+        polling: step.polling,
+        responseHandlers: step.responseHandlers,
+        retryTitle: step.retryTitle
+    };
+}
+function convertFormStepToDynamicLayout(step) {
+    var layout = convertCommonComponents(step);
+    if (step.reviewFields) {
+        layout.push(convertStepReviewToDynamicReview(step.reviewFields));
+    }
+    if (step.schemas) {
+        layout.push.apply(layout, getSchemaLayout(step));
+    }
+    if (step.actions) {
+        var actions = step.actions.map(convertStepActionToDynamicAction);
+        layout.push(dynamicBox(actions, 'md'));
+    }
+    return layout;
+}
+function convertFinalStepToDynamicLayout(step) {
+    var layout = [];
+    if (step.details) {
+        if (step.details.image) {
+            var image = convertFinalStepImageToDynamicImage(step.details.image);
+            layout.push(image);
+        }
+        if (step.details.title) {
+            layout.push(convertStepTitleToDynamicHeading(step.details.title));
+        }
+        if (step.details.description) {
+            layout.push(convertStepDescriptionToDynamicParagraph(step.details.description));
+        }
+    }
+    if (step.actions) {
+        var actions = step.actions.map(function (action) {
+            return convertStepActionToDynamicAction(__assign(__assign({}, action), { type: action.type || 'primary' }));
+        });
+        layout.push(dynamicBox(actions, 'md'));
+    }
+    return layout;
+}
+function convertDecisionStepToDynamicLayout(step) {
+    var layout = convertCommonComponents(step);
+    if (step.options) {
+        layout.push(convertStepDecisionToDynamicDecision(step.options));
+    }
+    return layout;
+}
+function dynamicBox(components, size) {
+    return {
+        type: 'box',
+        width: size || 'md',
+        components: components
+    };
+}
+function convertStepTitleToDynamicHeading(title) {
+    return {
+        type: 'heading',
+        text: title,
+        size: 'lg',
+        margin: 'lg',
+        align: 'center'
+    };
+}
+function convertStepDescriptionToDynamicParagraph(description) {
+    return {
+        type: 'paragraph',
+        text: description,
+        align: 'center'
+    };
+}
+function convertStepSchemaToDynamicForm(schema) {
+    return { type: 'form', schema: schema };
+}
+function convertStepDecisionToDynamicDecision(options) {
+    return {
+        type: 'decision',
+        options: options.map(convertStepDecisionOption)
+    };
+}
+function convertStepDecisionOption(option) {
+    return {
+        title: option.title,
+        description: option.description,
+        action: {
+            title: option.title,
+            method: 'GET',
+            url: option.url,
+            disabled: option.disabled
+        }
+    };
+}
+function convertStepImageToDynamicImage(image) {
+    return {
+        type: 'image',
+        url: image.url,
+        text: image.text,
+        margin: image.margin || 'lg',
+        size: image.size || 'md'
+    };
+}
+function convertFinalStepImageToDynamicImage(image) {
+    return typeof image === 'string'
+        ? {
+            type: 'image',
+            url: image,
+            text: undefined,
+            margin: 'lg',
+            size: 'md'
+        }
+        : convertStepImageToDynamicImage(image);
+}
+function convertStepActionToDynamicAction(action) {
+    var newAction = __assign(__assign({}, action), { title: action.title });
+    return {
+        type: 'button',
+        action: newAction
+    };
+}
+exports.convertStepActionToDynamicAction = convertStepActionToDynamicAction;
+function convertStepReviewToDynamicReview(reviewFields) {
+    return {
+        type: 'review',
+        title: reviewFields.title,
+        fields: reviewFields.fields.map(convertReviewFieldToDefinition)
+    };
+}
+function convertReviewFieldToDefinition(reviewField) {
+    return {
+        label: reviewField.title,
+        value: reviewField.value
+    };
+}
+function getSchemaLayout(step) {
+    var layout = [];
+    if (step.schemas && step.schemas[0]) {
+        var schema = step.schemas[0];
+        var dynamicForm = convertStepSchemaToDynamicForm(schema);
+        if (isWideForm()) {
+            layout.push(dynamicForm);
+        }
+        else {
+            layout.push(dynamicBox([dynamicForm], 'md'));
+        }
+    }
+    return layout;
+}
+function isWideForm() {
+    // For the time being we won't support automatically widening forms
+    // Unlike it V2, there is no way to easily iterate and identify narrow fields
+    return false;
+}
+function addMissingTitleAndDescriptionToStep(step, displayStepTitle) {
+    return __spreadArray(__spreadArray(__spreadArray([], (displayStepTitle && step.title ? [convertStepTitleToDynamicHeading(step.title)] : []), true), (step.description ? [convertStepDescriptionToDynamicParagraph(step.description)] : []), true), (step.layout || []), true);
+}

package/build/types/common/FormControl.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/index.d.ts

@@ -1,10 +1,15 @@
-export { convertStepToLayout, inlineReferences } from './step/layoutStep/utils';
-export { default as DynamicFlow } from './dynamicFlow';
-export { makeFetcher } from './common/makeFetcher';
-export { default as JsonSchemaForm } from './jsonSchemaForm';
-export { DynamicLayout as Layout } from './layout';
-export { isValidSchema } from './common/validators';
-export { default as translations } from './i18n';
-export * from './dynamicFlow/DynamicFlow';
-export type { DynamicFlowProps } from './dynamicFlow/DynamicFlowTypes';
-export type { Step } from './types';
+export * from './specification/core';
+export * from './specification/Action';
+export * from './specification/LayoutComponent';
+export * from './specification/Model';
+export * from './specification/Polling';
+export * from './specification/Step';
+export * from './specification/PersistAsync';
+export * from './specification/ValidationAsync';
+export * from './specification/Promotion';
+export type { Schema, AllOfSchema, ArraySchema, BasicSchema, BlobSchema, BooleanSchema, ConstSchema, IntegerSchema, MultipleFileUploadSchema, NumberSchema, ObjectSchema, OneOfObjectSchema, OneOfSchema, PersistAsyncSchema, StringSchema, ListArraySchema, TupleArraySchema, ValidationAsyncSchema, } from './specification/Schema';
+export { isObjectSchema, isOneOfSchema, isAllOfSchema, isBlobSchema, isArraySchema, isTupleArraySchema, isListArraySchema, isValidationAsyncSchema, isPersistAsyncSchema, isBasicSchema, } from './specification/Schema';
+export type { FileUploadSchema, CameraDirection } from './specification/FileUploadSchema';
+export { isFileUploadSchema } from './specification/FileUploadSchema';
+export { isBasicError } from './specification/Step';
+export * from './common/FormControl';

package/build/types/index.js

@@ -0,0 +1,42 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+exports.__esModule = true;
+exports.isBasicError = exports.isFileUploadSchema = exports.isBasicSchema = exports.isPersistAsyncSchema = exports.isValidationAsyncSchema = exports.isListArraySchema = exports.isTupleArraySchema = exports.isArraySchema = exports.isBlobSchema = exports.isAllOfSchema = exports.isOneOfSchema = exports.isObjectSchema = void 0;
+__exportStar(require("./specification/core"), exports);
+__exportStar(require("./specification/Action"), exports);
+__exportStar(require("./specification/LayoutComponent"), exports);
+__exportStar(require("./specification/Model"), exports);
+__exportStar(require("./specification/Polling"), exports);
+__exportStar(require("./specification/Step"), exports);
+__exportStar(require("./specification/PersistAsync"), exports);
+__exportStar(require("./specification/ValidationAsync"), exports);
+__exportStar(require("./specification/Promotion"), exports);
+var Schema_1 = require("./specification/Schema");
+__createBinding(exports, Schema_1, "isObjectSchema");
+__createBinding(exports, Schema_1, "isOneOfSchema");
+__createBinding(exports, Schema_1, "isAllOfSchema");
+__createBinding(exports, Schema_1, "isBlobSchema");
+__createBinding(exports, Schema_1, "isArraySchema");
+__createBinding(exports, Schema_1, "isTupleArraySchema");
+__createBinding(exports, Schema_1, "isListArraySchema");
+__createBinding(exports, Schema_1, "isValidationAsyncSchema");
+__createBinding(exports, Schema_1, "isPersistAsyncSchema");
+__createBinding(exports, Schema_1, "isBasicSchema");
+var FileUploadSchema_1 = require("./specification/FileUploadSchema");
+__createBinding(exports, FileUploadSchema_1, "isFileUploadSchema");
+var Step_1 = require("./specification/Step");
+__createBinding(exports, Step_1, "isBasicError");
+__exportStar(require("./common/FormControl"), exports);

package/build/types/specification/Action.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/FileUploadSchema.js

@@ -0,0 +1,8 @@
+"use strict";
+exports.__esModule = true;
+exports.isFileUploadSchema = void 0;
+// TODO HD Move this out of types
+function isFileUploadSchema(schema) {
+    return schema.type === 'string' && schema.format === 'base64url';
+}
+exports.isFileUploadSchema = isFileUploadSchema;

package/build/types/specification/LayoutComponent.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/Model.js

@@ -0,0 +1,38 @@
+"use strict";
+exports.__esModule = true;
+exports.isNullableArrayModel = exports.isArrayModel = exports.isNullableStringModel = exports.isNullableBasicModel = exports.isNullableObjectModel = exports.isObjectModel = void 0;
+var validators_1 = require("../../common/validators");
+// TODO HD Move these functions out of types
+var isObjectModel = function (model) {
+    return typeof model === 'object' && model !== null && model.constructor === Object;
+};
+exports.isObjectModel = isObjectModel;
+var isNullableObjectModel = function (model) {
+    return (0, validators_1.isNull)(model) || (0, exports.isObjectModel)(model);
+};
+exports.isNullableObjectModel = isNullableObjectModel;
+var isNullableBasicModel = function (model) {
+    return (0, validators_1.isBoolean)(model) || (0, validators_1.isNumber)(model) || (0, validators_1.isString)(model) || (0, validators_1.isNull)(model);
+};
+exports.isNullableBasicModel = isNullableBasicModel;
+var isNullableStringModel = function (model) {
+    return (0, validators_1.isString)(model) || (0, validators_1.isNull)(model);
+};
+exports.isNullableStringModel = isNullableStringModel;
+var isArrayModel = function (model) {
+    if ((0, validators_1.isArray)(model)) {
+        if (model.length === 0) {
+            return true;
+        }
+        return model.every(function (item) { return typeof item === 'string' || typeof item === 'number' || typeof item === 'boolean'; });
+    }
+    return false;
+};
+exports.isArrayModel = isArrayModel;
+var isNullableArrayModel = function (model) {
+    if ((0, validators_1.isNull)(model)) {
+        return true;
+    }
+    return (0, exports.isArrayModel)(model);
+};
+exports.isNullableArrayModel = isNullableArrayModel;

package/build/types/specification/PersistAsync.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/Polling.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/Promotion.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/Schema.js

@@ -0,0 +1,67 @@
+"use strict";
+exports.__esModule = true;
+exports.isMultipleFileUploadSchema = exports.isValidationAsyncSchema = exports.isPersistAsyncFileSchema = exports.isPersistAsyncSchema = exports.isStringSchema = exports.isListArraySchema = exports.isTupleArraySchema = exports.isArraySchema = exports.isBlobSchema = exports.isAllOfSchema = exports.isOneOfSchema = exports.isOneOfObjectSchema = exports.isObjectSchema = exports.isBasicSchema = void 0;
+var basicTypes = new Set(['string', 'number', 'integer', 'boolean']);
+// TODO HD Move these out of types
+function isBasicSchema(schema) {
+    return basicTypes.has(schema.type || '') || ('const' in schema && schema["const"] !== undefined);
+}
+exports.isBasicSchema = isBasicSchema;
+function isObjectSchema(schema) {
+    return schema.type === 'object';
+}
+exports.isObjectSchema = isObjectSchema;
+function isOneOfObjectSchema(schema) {
+    return isOneOfSchema(schema) && schema.oneOf.every(function (subSchema) { return subSchema.type === 'object'; });
+}
+exports.isOneOfObjectSchema = isOneOfObjectSchema;
+function isOneOfSchema(schema) {
+    return !!schema.oneOf;
+}
+exports.isOneOfSchema = isOneOfSchema;
+function isAllOfSchema(schema) {
+    return !!schema.allOf;
+}
+exports.isAllOfSchema = isAllOfSchema;
+function isBlobSchema(schema) {
+    return schema.type === 'blob';
+}
+exports.isBlobSchema = isBlobSchema;
+function isArraySchema(schema) {
+    return schema.type === 'array';
+}
+exports.isArraySchema = isArraySchema;
+function isTupleArraySchema(schema) {
+    var schemaItems = schema.items;
+    return Array.isArray(schemaItems);
+}
+exports.isTupleArraySchema = isTupleArraySchema;
+function isListArraySchema(schema) {
+    var schemaItems = schema.items;
+    return !Array.isArray(schemaItems);
+}
+exports.isListArraySchema = isListArraySchema;
+function isStringSchema(schema) {
+    return schema.type === 'string';
+}
+exports.isStringSchema = isStringSchema;
+function isPersistAsyncSchema(schema) {
+    return !!schema.persistAsync;
+}
+exports.isPersistAsyncSchema = isPersistAsyncSchema;
+function isPersistAsyncFileSchema(schema) {
+    return (isPersistAsyncSchema(schema) &&
+        (isBlobSchema(schema.persistAsync.schema) || isBase64FileSchema(schema.persistAsync.schema)));
+}
+exports.isPersistAsyncFileSchema = isPersistAsyncFileSchema;
+var isValidationAsyncSchema = function (schema) {
+    return isBasicSchema(schema) && !!schema.validationAsync;
+};
+exports.isValidationAsyncSchema = isValidationAsyncSchema;
+function isBase64FileSchema(schema) {
+    return schema.type === 'string' && schema.format === 'base64url';
+}
+var isMultipleFileUploadSchema = function (schema) {
+    return (isArraySchema(schema) && isListArraySchema(schema) && isPersistAsyncFileSchema(schema.items));
+};
+exports.isMultipleFileUploadSchema = isMultipleFileUploadSchema;

package/build/types/specification/Step.js

@@ -0,0 +1,8 @@
+"use strict";
+exports.__esModule = true;
+exports.isBasicError = void 0;
+var validators_1 = require("../../common/validators");
+var isBasicError = function (error) {
+    return (0, validators_1.isString)(error) || (0, validators_1.isNull)(error);
+};
+exports.isBasicError = isBasicError;

package/build/types/specification/ValidationAsync.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/build/types/specification/core.js

@@ -0,0 +1,2 @@
+"use strict";
+exports.__esModule = true;

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@wise/dynamic-flow-client",
-  "version": "0.4.0-beta-d2067b.7",
+  "version": "0.4.0",
   "description": "Dynamic Flow web client",
-  "main": "./build/main.min.js",
+  "main": "./build/index.js",
   "types": "./build/index.d.ts",
   "style": "./build/main.css",
+  "type": "commonjs",
   "sideEffects": [
     "*.css"
   ],
@@ -16,24 +17,6 @@
     "fullname": "transferwise/dynamic-flow",
     "url": "git+https://github.com/transferwise/dynamic-flow.git"
   },
-  "scripts": {
-    "dev": "storybook dev -p 3003",
-    "build": "npm-run-all build:*",
-    "build:types": "tsc --build ./tsconfig.build.json",
-    "build:js": "node ./scripts/build-min.mjs",
-    "build:css": "postcss src/main.css -o build/main.css",
-    "build:messages-source": "formatjs extract 'src/**/*.messages.{js,ts}' --out-file src/i18n/en.json --format simple && prettier --find-config-path --write src/i18n/*.json",
-    "build:compiled-messages": "mkdir -p build/i18n && cp src/i18n/*.json build/i18n",
-    "test": "npm-run-all test:once test:tz",
-    "test:once": "jest --config jest.config.js --env=jsdom",
-    "test:coverage": "jest --config jest.config.js --env=jsdom --coverage",
-    "test:tz": "TZ=US/Pacific jest ./src/jsonSchemaForm/basicTypeSchema/BasicTypeSchema.errors.spec.js ./src/formControl/FormControl.spec.js",
-    "test:watch": "pnpm test:once --watch",
-    "lint": "npm-run-all lint:*",
-    "lint:ts": "eslint 'src/**/*.{js,jsx,ts,tsx}' --quiet",
-    "lint:css": "stylelint './src/**/*.css'",
-    "build-storybook": "storybook build -c .storybook"
-  },
   "devDependencies": {
     "@babel/core": "7.20.12",
     "@babel/plugin-syntax-flow": "7.18.6",
@@ -56,7 +39,7 @@
     "@testing-library/react": "14.0.0",
     "@testing-library/react-hooks": "8.0.1",
     "@testing-library/user-event": "13.2.1",
-    "@transferwise/components": "45.3.0",
+    "@transferwise/components": "45.4.0",
     "@transferwise/eslint-config": "8.0.1",
     "@transferwise/formatting": "^2.10.0",
     "@transferwise/icons": "3.6.0",
@@ -72,7 +55,6 @@
     "babel-jest": "29.5.0",
     "currency-flags": "4.0.7",
     "enzyme": "^3.11.0",
-    "esbuild": "0.17.19",
     "eslint": "8.36.0",
     "eslint-plugin-storybook": "0.6.12",
     "jest": "29.5.0",
@@ -110,5 +92,22 @@
     "react-webcam": "^7.0.1",
     "screenfull": "^5.0.2"
   },
-  "prettier": "@transferwise/eslint-config/.prettierrc.js"
-}
+  "prettier": "@transferwise/eslint-config/.prettierrc.js",
+  "scripts": {
+    "dev": "storybook dev -p 3003",
+    "build": "rm -rf build && npm-run-all build:*",
+    "build:ts": "tsc --build ./tsconfig.build.json",
+    "build:css": "postcss src/main.css -o build/main.css",
+    "build:messages-source": "formatjs extract 'src/**/*.messages.{js,ts}' --out-file src/i18n/en.json --format simple && prettier --find-config-path --write src/i18n/*.json",
+    "build:compiled-messages": "mkdir -p build/i18n && cp src/i18n/*.json build/i18n",
+    "test": "npm-run-all test:once test:tz",
+    "test:once": "jest --config jest.config.js --env=jsdom",
+    "test:coverage": "jest --config jest.config.js --env=jsdom --coverage",
+    "test:tz": "TZ=US/Pacific jest ./src/jsonSchemaForm/basicTypeSchema/BasicTypeSchema.errors.spec.js ./src/formControl/FormControl.spec.js",
+    "test:watch": "pnpm test:once --watch",
+    "lint": "npm-run-all lint:ts lint:css",
+    "lint:ts": "eslint 'src/**/*.{js,jsx,ts,tsx}' --quiet",
+    "lint:css": "stylelint './src/**/*.css'",
+    "build-storybook": "storybook build -c .storybook"
+  }
+}