@wise/dynamic-flow-client 0.2.1 → 0.3.0-beta-ec09e7.2

package/build/jsonSchemaForm/persistAsyncSchema/basic/PersistAsyncBasicSchema.js

@@ -41,9 +41,9 @@ import { useEffect, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { FormControlType } from '../../../common';
 import { isStatus2xx, isStatus422 } from '../../../common/api/utils';
+import { useEventDispatcher } from '../../../common/contexts/events';
 import { useFetcher } from '../../../common/contexts/fetcherContext';
 import usePrevious from '../../../common/hooks/usePrevious';
-import { useTracking } from '../../../common/tracking';
 import { isValidSchema } from '../../../common/validation/schema-validators';
 import BasicTypeSchema from '../../basicTypeSchema';
 import { getControlType } from '../../schemaFormControl/SchemaFormControl';
@@ -67,7 +67,7 @@ var controlTypesWithPersistOnChange = new Set([
 var PersistAsyncBasicSchema = function (props) {
     var intl = useIntl();
     var fetcher = useFetcher();
-    var trackEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var _a = useState(null), persistAsyncModel = _a[0], setPersistAsyncModel = _a[1];
     var previousPersistAsyncModel = usePrevious(persistAsyncModel);
     var _b = useState(null), persistAsyncError = _b[0], setPersistAsyncError = _b[1];
@@ -95,7 +95,7 @@ var PersistAsyncBasicSchema = function (props) {
                     _d.label = 1;
                 case 1:
                     _d.trys.push([1, 4, , 5]);
-                    trackEvent('Dynamic Flow - PersistAsync', { status: 'pending', schemaId: schema.$id });
+                    onEvent('Dynamic Flow - PersistAsync', { status: 'pending', schemaId: schema.$id });
                     persistAsyncFetch = fetcher(persistAsyncSpec.url, {
                         method: persistAsyncSpec.method,
                         headers: { 'Content-Type': 'application/json' },
@@ -126,11 +126,11 @@ var PersistAsyncBasicSchema = function (props) {
                     else {
                         setGenericPersistAsyncError();
                     }
-                    trackEvent('Dynamic Flow - PersistAsync', { status: 'success', schemaId: schema.$id });
+                    onEvent('Dynamic Flow - PersistAsync', { status: 'success', schemaId: schema.$id });
                     return [3 /*break*/, 5];
                 case 4:
                     _b = _d.sent();
-                    trackEvent('Dynamic Flow - PersistAsync', { status: 'failure', schemaId: schema.$id });
+                    onEvent('Dynamic Flow - PersistAsync', { status: 'failure', schemaId: schema.$id });
                     setGenericPersistAsyncError();
                     return [3 /*break*/, 5];
                 case 5: return [2 /*return*/];

package/build/jsonSchemaForm/persistAsyncSchema/blob/PersistAsyncBlobSchema.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { BlobSchema, PersistAsync, Schema } from '../../../dynamic-flow-types';
 import { GenericSchemaProps } from '../../genericSchema/GenericSchema';
 declare const PersistAsyncBlobSchema: {

package/build/jsonSchemaForm/persistAsyncSchema/blob/PersistAsyncBlobSchema.js

@@ -49,8 +49,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
 import { useEffect, useState } from 'react';
 import { isStatus422 } from '../../../common/api/utils';
+import { useEventDispatcher } from '../../../common/contexts/events';
 import { useFetcher } from '../../../common/contexts/fetcherContext';
-import { useTracking } from '../../../common/tracking';
 import { getValidationFailures } from '../../../common/validation/validation-failures';
 import ControlFeedback from '../../controlFeedback';
 import { mapSchemaToUploadOptions } from '../../schemaFormControl/optionMapper';
@@ -62,7 +62,7 @@ var PersistAsyncBlobSchema = function (props) {
     var _c = useState([]), validations = _c[0], setValidations = _c[1];
     var _d = useState(false), changed = _d[0], setChanged = _d[1];
     var fetcher = useFetcher();
-    var trackEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var refreshValidations = function () {
         if (props.submitted) {
             setValidations(getValidationFailures(props.model, props.schema, !!props.required));
@@ -79,7 +79,7 @@ var PersistAsyncBlobSchema = function (props) {
                     id = getIdFromResponse(props.schema.persistAsync.idProperty, jsonResponse);
                     props.onChange({ model: id, triggerSchema: props.schema, triggerModel: id });
                     setChanged(true);
-                    trackEvent('Dynamic Flow - PersistAsync', { status: 'success', schemaId: props.schema.$id });
+                    onEvent('Dynamic Flow - PersistAsync', { status: 'success', schemaId: props.schema.$id });
                     return [2 /*return*/];
             }
         });
@@ -99,7 +99,7 @@ var PersistAsyncBlobSchema = function (props) {
                 case 2:
                     props.onChange({ model: null, triggerSchema: props.schema, triggerModel: null });
                     setChanged(true);
-                    trackEvent('Dynamic Flow - PersistAsync', { status: 'failure', schemaId: props.schema.$id });
+                    onEvent('Dynamic Flow - PersistAsync', { status: 'failure', schemaId: props.schema.$id });
                     return [2 /*return*/];
             }
         });

package/build/jsonSchemaForm/persistAsyncSchema/blob/UploadInputAdapter.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { UploadProps } from '@transferwise/components/build/types/upload/Upload';
 import { PersistAsync } from '../../../dynamic-flow-types';
 import { Fetcher } from '../../../schema';

package/build/jsonSchemaForm/persistAsyncSchema/blob/UploadInputAdapter.js

@@ -1,14 +1,14 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Status, UploadInput } from '@transferwise/components';
 import { useMemo } from 'react';
-import { useTracking } from '../../../common/tracking';
+import { useEventDispatcher } from '../../../common/contexts/events';
 import { toKilobytes } from '../../../common/utils/file-utils';
 export var UploadInputAdapter = function (props) {
     var id = props.id, _a = props.fetcher, fetcher = _a === void 0 ? fetch : _a, httpOptions = props.httpOptions, fileId = props.fileId, idProperty = props.idProperty, usAccept = props.usAccept, maxSize = props.maxSize, usPlaceholder = props.usPlaceholder, onSuccess = props.onSuccess, onFailure = props.onFailure, onCancel = props.onCancel;
-    var trackEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var files = useMemo(function () { return (fileId ? [{ id: fileId, status: Status.SUCCEEDED }] : []); }, [fileId]);
     var uploadFile = function (formData) {
-        trackEvent('Dynamic Flow - PersistAsync', { status: 'pending', schemaId: id });
+        onEvent('Dynamic Flow - PersistAsync', { status: 'pending', schemaId: id });
         return fetcher("".concat(httpOptions.url), {
             method: httpOptions.method || 'POST',
             body: formData

package/build/jsonSchemaForm/promotedOneOfSchema/PromotedOneOfSchema.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ObjectModel, OneOfObjectSchema } from '../../dynamic-flow-types';
 import { GenericSchemaProps } from '../genericSchema/GenericSchema';
 declare const PromotedOneOfSchema: (props: PromotedOneOfSchemaProps) => JSX.Element;

package/build/jsonSchemaForm/promotedOneOfSchema/control/PromotedOneOfCheckboxControl.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PromotedOneOfControlProps } from './PromotedOneOfControl';
 declare const PromotedOneOfCheckboxControl: {
     (props: PromotedOneOfControlProps): JSX.Element;

package/build/jsonSchemaForm/promotedOneOfSchema/control/PromotedOneOfRadioControl.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PromotedOneOfControlProps } from './PromotedOneOfControl';
 declare const PromotedOneOfRadioControl: {
     (props: PromotedOneOfControlProps): JSX.Element;

package/build/jsonSchemaForm/readOnlySchema/ReadOnlySchema.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Model, Schema } from '../../dynamic-flow-types';
 type ReadOnlySchemaProps = {
     schema: Schema;

package/build/jsonSchemaForm/schemaFormControl/SchemaFormControl.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FormControlType } from '../../common';
 import { BasicModel, Schema } from '../../dynamic-flow-types';
 export declare const getControlType: (schema: Schema) => (typeof FormControlType)[keyof typeof FormControlType] | undefined;

package/build/jsonSchemaForm/schemaFormControl/optionMapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Icon, Image, Schema } from '../../dynamic-flow-types';
 export declare const mapConstSchemaToOption: (schema: Schema, controlType?: string) => RadioOption | SelectOption;
 export type RadioOption = {

package/build/jsonSchemaForm/validationAsyncSchema/ValidationAsyncSchema.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { BasicModel } from '../../dynamic-flow-types';
 import { ValidationAsyncSchema as ValidationAsyncSchemaType } from '../../dynamic-flow-types/Schema';
 import { GenericSchemaProps } from '../genericSchema/GenericSchema';

package/build/jsonSchemaForm/validationAsyncSchema/ValidationAsyncSchema.js

@@ -49,9 +49,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { isNull, isObject, isString } from '@transferwise/neptune-validation';
 import isEqual from 'lodash.isequal';
 import { useRef, useState } from 'react';
+import { useEventDispatcher } from '../../common/contexts/events';
 import { useFetcher } from '../../common/contexts/fetcherContext';
 import { useLogger } from '../../common/logging';
-import { useTracking } from '../../common/tracking';
 import { isValidSchema } from '../../common/validation/schema-validators';
 import BasicTypeSchema from '../basicTypeSchema';
 var ValidationAsyncSchema = function (props) {
@@ -62,7 +62,7 @@ var ValidationAsyncSchema = function (props) {
     var _d = useState(false), fieldSubmitted = _d[0], setFieldSubmitted = _d[1];
     var _e = useState(null), abortController = _e[0], setAbortController = _e[1];
     var fetcher = useFetcher();
-    var trackEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var logger = useLogger();
     var getValidationAsyncResponse = function (currentValidationAsyncModel, validationAsyncSpec) { return __awaiter(void 0, void 0, void 0, function () {
         var signal, requestBody, response, jsonResponse, _a;
@@ -77,7 +77,7 @@ var ValidationAsyncSchema = function (props) {
                     if (!validationAsyncSpec.method) {
                         logger.warning('Invalid schema or model', 'ValidationAsyncSchema without a "method" property would have defaulted to "GET" in previous versions. Now defaults to "POST".', {});
                     }
-                    trackEvent('Dynamic Flow - ValidationAsync', { status: 'pending' });
+                    onEvent('Dynamic Flow - ValidationAsync', { status: 'pending' });
                     return [4 /*yield*/, fetcher(validationAsyncSpec.url, {
                             method: validationAsyncSpec.method || 'POST',
                             headers: { 'Content-Type': 'application/json' },
@@ -95,7 +95,7 @@ var ValidationAsyncSchema = function (props) {
                     if (!isObject(jsonResponse)) {
                         throw new Error('Response body is not an object');
                     }
-                    trackEvent('Dynamic Flow - ValidationAsync', { status: 'success' });
+                    onEvent('Dynamic Flow - ValidationAsync', { status: 'success' });
                     if (response.status === 200) {
                         setValidationAsyncSuccessMessage(isString(jsonResponse.message) ? jsonResponse.message : null);
                     }
@@ -105,7 +105,7 @@ var ValidationAsyncSchema = function (props) {
                     return [3 /*break*/, 5];
                 case 4:
                     _a = _c.sent();
-                    trackEvent('Dynamic Flow - ValidationAsync', { status: 'failure' });
+                    onEvent('Dynamic Flow - ValidationAsync', { status: 'failure' });
                     return [3 /*break*/, 5];
                 case 5: return [2 /*return*/];
             }

package/build/layout/DynamicLayout.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FormErrors, LayoutComponent, Model } from '../dynamic-flow-types';
 import { OnAction, OnModelChange, OnPersistAsync } from '../schema';
 export type CommonLayoutProps = {

package/build/layout/alert/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Alert as AlertType } from '../../dynamic-flow-types';
 declare const DynamicAlert: (props: {
     component: AlertType;

package/build/layout/box/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { BoxLayout } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../DynamicLayout';
 type Props = CommonLayoutProps & {

package/build/layout/button/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonLayout } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../DynamicLayout';
 type Props = Omit<CommonLayoutProps, 'submitted' | 'onModelChange' | 'onPersistAsync'> & {

package/build/layout/columns/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ColumnsLayout } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../DynamicLayout';
 type Props = CommonLayoutProps & {

package/build/layout/decision/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DecisionLayout } from '../../dynamic-flow-types';
 import { OnAction } from '../../schema';
 type Props = {

package/build/layout/divider/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DividerLayout } from '../../dynamic-flow-types';
 type Props = {
     component: DividerLayout;

package/build/layout/external/DynamicExternal.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Action, ExternalLayout } from '../../dynamic-flow-types';
 type Props = {
     component: ExternalLayout;

package/build/layout/form/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FormLayout } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../DynamicLayout';
 type Props = Omit<CommonLayoutProps, 'onAction'> & {

package/build/layout/heading/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HeadingLayout } from '../../dynamic-flow-types';
 declare const DynamicHeading: (props: {
     component: HeadingLayout;

package/build/layout/icon/index.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
 type Props = {
     type: string;
 };
-declare const DynamicIcon: (props: Props) => JSX.Element;
+declare const DynamicIcon: ({ type }: Props) => JSX.Element;
 export declare function isValidIconName(name: string): boolean;
 export default DynamicIcon;

package/build/layout/icon/index.js

@@ -1,7 +1,8 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import * as icons from '@transferwise/icons';
-var DynamicIcon = function (props) {
-    var iconName = toCapitalisedCamelCase(props.type);
+var DynamicIcon = function (_a) {
+    var type = _a.type;
+    var iconName = toCapitalisedCamelCase(type);
     if (!Object.keys(icons).includes(iconName)) {
         return _jsx(_Fragment, {});
     }

package/build/layout/image/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ImageLayout } from '../../dynamic-flow-types';
 type DynamicImageProps = {
     component: ImageLayout;

package/build/layout/image/index.js

@@ -91,8 +91,13 @@ var getImageSource = function (fetcher, imageUrl) { return __awaiter(void 0, voi
                         headers: { 'Content-Type': 'image/image' },
                         credentials: 'same-origin'
                     })
-                        .then(function (response) { return response.blob(); })
-                        .then(readImageBlobAsDataURL)];
+                        .then(function (response) {
+                        if (response.ok) {
+                            return response.blob();
+                        }
+                        throw new Error('Image fetching failed');
+                    })
+                        .then(readImageBlobAsDataURL)["catch"](function () { return imageUrl; })];
             }
             return [2 /*return*/, imageUrl];
         }

package/build/layout/info/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { InfoLayout } from '../../dynamic-flow-types';
 type Props = {
     component: InfoLayout;

package/build/layout/list/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Action, ListLayout } from '../../dynamic-flow-types';
 type Props = {
     component: ListLayout;

package/build/layout/loading-indicator/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { LoadingIndicatorLayout } from '../../dynamic-flow-types';
 type Props = {
     component: LoadingIndicatorLayout;

package/build/layout/paragraph/DynamicParagraph.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ParagraphLayout } from '../../dynamic-flow-types';
 type Props = {
     component: ParagraphLayout;

package/build/layout/review/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ReviewLayout } from '../../dynamic-flow-types';
 import { OnAction } from '../../schema';
 type Props = {

package/build/main.css

@@ -41,8 +41,6 @@
   touch-action: manipulation;
   transition: all 0.15s ease-in-out;
   user-select: none;
-  user-select: none;
-  user-select: none;
   vertical-align: middle;
   width: 76px;
 }
@@ -168,15 +166,15 @@
   .df-image.xs img {
     width: 100px;
   }
-  
+
   .df-image.sm img {
     width: 200px;
   }
-  
+
   .df-image.md img {
     width: 300px;
   }
-  
+
   .df-image.lg img {
     width: 500px;
   }
@@ -184,5 +182,4 @@
   .df-image.xl img {
     max-width: 600px;
   }
-  
 }

package/build/step/cameraStep/CameraStep.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Step } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../../layout/DynamicLayout';
 export type CameraStepProps = Omit<CommonLayoutProps, 'onPersistAsync' | 'baseUrl'> & {

package/build/step/cameraStep/CameraStep.js

@@ -36,8 +36,8 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
+import { useEventDispatcher } from '../../common/contexts/events';
 import { filterHiddenSchemas } from '../../common/stepTypes/stepTypes';
-import { useTracking } from '../../common/tracking';
 import { isObjectSchema } from '../../dynamic-flow-types';
 import CameraCapture from './cameraCapture';
 function blobToBase64(blob) {
@@ -53,7 +53,7 @@ function blobToBase64(blob) {
 }
 var CameraStep = function (props) {
     var step = props.step, model = props.model, onModelChange = props.onModelChange, onAction = props.onAction;
-    var onTrackableEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var objectSchema = getObjectSchema(step);
     var cameraSchema = getCameraSchema(step);
     var action = getFirstAction(step);
@@ -92,7 +92,7 @@ var CameraStep = function (props) {
             }
         });
     }); };
-    return (_jsx(CameraCapture, { overlay: overlay, outline: outline, title: title, imageUrl: imageUrl, instructions: instructions, direction: direction, onTrackableEvent: onTrackableEvent, onCapture: function (blob) {
+    return (_jsx(CameraCapture, { overlay: overlay, outline: outline, title: title, imageUrl: imageUrl, instructions: instructions, direction: direction, onEvent: onEvent, onCapture: function (blob) {
             void handleCapture(blob);
         } }));
 };

package/build/step/cameraStep/cameraCapture/CameraCapture.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { TrackableEventHandler } from '../../../common/tracking';
+import { EventHandler } from '../../../common/contexts/events';
 import { CameraDirection } from '../../../dynamic-flow-types/FileUploadSchema';
 type Props = {
     direction?: CameraDirection;
@@ -10,7 +9,7 @@ type Props = {
     instructions?: string;
     showReview?: boolean;
     onCapture: BlobCallback;
-    onTrackableEvent?: TrackableEventHandler;
+    onEvent?: EventHandler;
 };
-declare const CameraCapture: ({ direction, overlay, outline, imageUrl, title, instructions, showReview, onCapture, onTrackableEvent, }: Props) => JSX.Element;
+declare const CameraCapture: ({ direction, overlay, outline, imageUrl, title, instructions, showReview, onCapture, onEvent, }: Props) => JSX.Element;
 export default CameraCapture;

package/build/step/cameraStep/cameraCapture/CameraCapture.js

@@ -57,7 +57,7 @@ import { CameraNotSupported, NoCameraAccess } from './screens';
 import { trackCameraFeedStarted, trackCameraNotSupported, trackCameraPermissionDenied, } from './tracking';
 import { generateCanvasFromVideo, isSelfieCamera } from './utils';
 var CameraCapture = function (_a) {
-    var _b = _a.direction, direction = _b === void 0 ? 'back' : _b, _c = _a.overlay, overlay = _c === void 0 ? '' : _c, _d = _a.outline, outline = _d === void 0 ? '' : _d, _e = _a.imageUrl, imageUrl = _e === void 0 ? '' : _e, _f = _a.title, title = _f === void 0 ? '' : _f, _g = _a.instructions, instructions = _g === void 0 ? '' : _g, _h = _a.showReview, showReview = _h === void 0 ? false : _h, onCapture = _a.onCapture, onTrackableEvent = _a.onTrackableEvent;
+    var _b = _a.direction, direction = _b === void 0 ? 'back' : _b, _c = _a.overlay, overlay = _c === void 0 ? '' : _c, _d = _a.outline, outline = _d === void 0 ? '' : _d, _e = _a.imageUrl, imageUrl = _e === void 0 ? '' : _e, _f = _a.title, title = _f === void 0 ? '' : _f, _g = _a.instructions, instructions = _g === void 0 ? '' : _g, _h = _a.showReview, showReview = _h === void 0 ? false : _h, onCapture = _a.onCapture, onEvent = _a.onEvent;
     var _j = useState('CAPTURE'), mode = _j[0], setMode = _j[1];
     var _k = useState(false), isVideoMirrored = _k[0], setIsVideoMirrored = _k[1];
     var _l = useState(false), ready = _l[0], setReady = _l[1];
@@ -96,17 +96,17 @@ var CameraCapture = function (_a) {
     var handleUserMediaError = useCallback(function (error) {
         if (error instanceof DOMException && (error === null || error === void 0 ? void 0 : error.name) === 'NotAllowedError') {
             setMode('NO_CAMERA_ACCESS');
-            trackCameraPermissionDenied(onTrackableEvent);
+            trackCameraPermissionDenied(onEvent);
             return;
         }
         setMode('CAMERA_NOT_SUPPORTED');
-        trackCameraNotSupported(onTrackableEvent, error);
-    }, [setMode, onTrackableEvent]);
+        trackCameraNotSupported(onEvent, error);
+    }, [setMode, onEvent]);
     var handleUserMedia = useCallback(function (stream) {
         setReady(true);
         setIsVideoMirrored(isSelfieCamera(stream));
-        void trackCameraFeedStarted(onTrackableEvent, { direction: direction }, stream);
-    }, [setIsVideoMirrored, onTrackableEvent, direction]);
+        void trackCameraFeedStarted(onEvent, { direction: direction }, stream);
+    }, [setIsVideoMirrored, onEvent, direction]);
     var handleReviewSubmit = function () {
         onCapture((reviewImage === null || reviewImage === void 0 ? void 0 : reviewImage.blob) || null);
     };

package/build/step/cameraStep/cameraCapture/components/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const CaptureBottomBar: ({ onCapture }: {
     onCapture: () => void;
 }) => JSX.Element;

package/build/step/cameraStep/cameraCapture/overlay/Overlay.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type Props = {
     overlay?: string;
     outline?: string;

package/build/step/cameraStep/cameraCapture/screens/CameraNotSupported/CameraNotSupported.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const CameraNotSupported: () => JSX.Element;
 export default CameraNotSupported;

package/build/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type Props = {
     onAction: () => void;
 };

package/build/step/cameraStep/cameraCapture/tracking/index.d.ts

@@ -1,7 +1,7 @@
-import { TrackableEventHandler } from '../../../../common/tracking';
+import { EventHandler } from '../../../../common/contexts/events';
 import { CameraDirection } from '../../../../dynamic-flow-types/FileUploadSchema';
-export declare const trackCameraPermissionDenied: (onTrackableEvent: TrackableEventHandler | undefined) => void | undefined;
-export declare const trackCameraFeedStarted: (onTrackableEvent: TrackableEventHandler | undefined, props: {
+export declare const trackCameraPermissionDenied: (onEvent: EventHandler | undefined) => void | undefined;
+export declare const trackCameraFeedStarted: (onEvent: EventHandler | undefined, props: {
     direction?: CameraDirection;
 }, stream: MediaStream) => Promise<void | undefined>;
-export declare const trackCameraNotSupported: (onTrackableEvent: TrackableEventHandler | undefined, error: string | DOMException) => void | undefined;
+export declare const trackCameraNotSupported: (onEvent: EventHandler | undefined, error: string | DOMException) => void | undefined;

package/build/step/cameraStep/cameraCapture/tracking/index.js

@@ -46,29 +46,26 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 import { getActiveVideoDeviceLabel, getAvailableVideoDeviceLabels, getVideoCapabilities, getVideoTrack, } from '../utils';
-export var trackCameraPermissionDenied = function (onTrackableEvent) {
-    return onTrackableEvent === null || onTrackableEvent === void 0 ? void 0 : onTrackableEvent('Dynamic Flow - Camera Permission Denied', {});
+export var trackCameraPermissionDenied = function (onEvent) {
+    return onEvent === null || onEvent === void 0 ? void 0 : onEvent('Dynamic Flow - Camera Permission Denied', {});
 };
-export var trackCameraFeedStarted = function (onTrackableEvent, props, stream) { return __awaiter(void 0, void 0, void 0, function () {
-    var _a, _b, _c;
-    return __generator(this, function (_d) {
-        switch (_d.label) {
-            case 0:
-                if (!(onTrackableEvent === null || onTrackableEvent === void 0)) return [3 /*break*/, 1];
-                _a = void 0;
-                return [3 /*break*/, 3];
-            case 1:
-                _b = onTrackableEvent;
-                _c = ['Dynamic Flow - Camera Feed Started'];
-                return [4 /*yield*/, getCameraStartedProperties(props, stream)];
-            case 2:
-                _a = _b.apply(void 0, _c.concat([_d.sent()]));
-                _d.label = 3;
-            case 3: return [2 /*return*/, _a];
-        }
-    });
-}); };
-export var trackCameraNotSupported = function (onTrackableEvent, error) { return onTrackableEvent === null || onTrackableEvent === void 0 ? void 0 : onTrackableEvent('Dynamic Flow - Camera Not Supported', { Error: error }); };
+export var trackCameraFeedStarted = function (onEvent, props, stream) { return __awaiter(void 0, void 0, void 0, function () { var _a, _b, _c; return __generator(this, function (_d) {
+    switch (_d.label) {
+        case 0:
+            if (!(onEvent === null || onEvent === void 0)) return [3 /*break*/, 1];
+            _a = void 0;
+            return [3 /*break*/, 3];
+        case 1:
+            _b = onEvent;
+            _c = ['Dynamic Flow - Camera Feed Started'];
+            return [4 /*yield*/, getCameraStartedProperties(props, stream)];
+        case 2:
+            _a = _b.apply(void 0, _c.concat([_d.sent()]));
+            _d.label = 3;
+        case 3: return [2 /*return*/, _a];
+    }
+}); }); };
+export var trackCameraNotSupported = function (onEvent, error) { return onEvent === null || onEvent === void 0 ? void 0 : onEvent('Dynamic Flow - Camera Not Supported', { Error: error }); };
 var getCameraStartedProperties = function (props, videoStream) { return __awaiter(void 0, void 0, void 0, function () {
     var videoTrack, capabilities, settings, _a, _b, _c, _d;
     var _e;

package/build/step/externalConfirmationStep/ExternalConfirmationStep.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type Props = {
     url: string;
     onClose: () => void;

package/build/step/layoutStep/LayoutStep.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FormErrors, Step } from '../../dynamic-flow-types';
 import { CommonLayoutProps } from '../../layout/DynamicLayout';
 import { StepLayoutOptions } from './layoutService/convertStepToLayout';

package/build/step/layoutStep/LayoutStep.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { isEmpty } from '@transferwise/neptune-validation';
 import { useDynamicFlow } from '../../common/contexts/dynamicFlowContext/dynamicFlowContext';
-import { useTracking } from '../../common/tracking';
+import { useEventDispatcher } from '../../common/contexts/events';
 import DynamicLayout from '../../layout';
 import { useStepPolling } from '../features';
 import { convertStepToLayout, inlineReferences } from './layoutService';
@@ -22,11 +22,11 @@ var LayoutStep = function (props) {
     var stepSpecification = props.stepSpecification, stepLayoutOptions = props.stepLayoutOptions, submitted = props.submitted, model = props.model, formErrors = props.formErrors, onModelChange = props.onModelChange;
     var components = getComponents(stepSpecification, stepLayoutOptions);
     var _a = useDynamicFlow(), loading = _a.loading, registerPersistAsyncPromise = _a.registerPersistAsyncPromise;
-    var trackEvent = useTracking();
+    var onEvent = useEventDispatcher();
     var onAction = !loading
         ? props.onAction
         : function () {
-            trackEvent('Dynamic Flow - onAction supressed', { reason: 'LayoutStep - loading state' });
+            onEvent('Dynamic Flow - onAction supressed', { reason: 'LayoutStep - loading state' });
         };
     useStepPolling(stepSpecification.polling, onAction);
     return (_jsx(DynamicLayout, { components: components, submitted: submitted, model: model, errors: formErrors, onAction: onAction, onModelChange: onModelChange, onPersistAsync: registerPersistAsyncPromise }));