@wise/dynamic-flow-client 0.1.1 → 0.1.3

package/build/step/cameraStep/cameraCapture/overlay/Overlay.js

@@ -0,0 +1,78 @@
+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);
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable fp/no-mutation */
+import debounce from 'lodash.debounce';
+import { useEffect, useRef } from 'react';
+var captureButtonHeight = 92;
+var reviewButtonsHeight = 120;
+var imageHeight = 40;
+var titleHeight = 32;
+var instructionsHeight = 48;
+var reviewInstructionsHeight = 40;
+var overlayMaxWidth = 800;
+var Overlay = function (_a) {
+    var overlay = _a.overlay, outline = _a.outline, imageUrl = _a.imageUrl, title = _a.title, instructions = _a.instructions, reviewInstructions = _a.reviewInstructions;
+    var svgReference = useRef(null);
+    /*
+      SVG doesn't always rerender when screen orientation changes,
+      so need to force rerender
+     */
+    useEffect(function () {
+        var listener = debounce(function () {
+            var _a;
+            if ((_a = svgReference.current) === null || _a === void 0 ? void 0 : _a.innerHTML) {
+                var reference = svgReference.current;
+                reference.innerHTML += '';
+            }
+        }, 100);
+        window.addEventListener('resize', listener);
+        return function () { return window.removeEventListener('resize', listener); };
+    });
+    var helperBoxHeight = (imageUrl ? imageHeight : 0) +
+        (title ? titleHeight : 0) +
+        (instructions ? instructionsHeight : 0);
+    var helperBox = (_jsxs(_Fragment, { children: [imageUrl && _jsx("img", { className: "camera-capture-img", src: imageUrl, alt: "" }), title && _jsx("h4", __assign({ className: "camera-capture-title" }, { children: title })), instructions && _jsx("small", __assign({ className: "camera-capture-instructions" }, { children: instructions }))] }));
+    var frameBottomMargin = captureButtonHeight + helperBoxHeight;
+    /*
+        frameBottomMargin needs to stay the same for the review page so that
+        the overlay position does not change! Basically if it is the review step
+        and there is a 'reviewInstructions' specified, the overlay position stays
+        the same, but the helperBox height and content changes to adjust for the
+        large review buttons and smaller height required by 'reviewInstructionsHeight'
+     */
+    if (reviewInstructions) {
+        helperBoxHeight = frameBottomMargin - reviewButtonsHeight;
+        helperBox = _jsx("small", __assign({ className: "camera-capture-instructions" }, { children: reviewInstructions }));
+        var frameWithReviewInstructionsMinBottomMargin = reviewButtonsHeight + reviewInstructionsHeight;
+        if (frameBottomMargin < frameWithReviewInstructionsMinBottomMargin) {
+            helperBox = _jsx(_Fragment, {});
+        }
+    }
+    var framePosition = {
+        x: '50%',
+        y: '5%',
+        width: "min(90%, ".concat(overlayMaxWidth, "px)"),
+        height: "calc(90% - ".concat(frameBottomMargin, "px)"),
+        style: { transform: "translateX(max(-45%, -".concat(overlayMaxWidth / 2, "px))") }
+    };
+    var helperBoxPosition = {
+        style: {
+            left: '5%',
+            top: "calc(100% - ".concat(frameBottomMargin, "px - 5%)"),
+            height: "calc(".concat(helperBoxHeight, "px + 5%)"),
+            width: '90%'
+        }
+    };
+    return (_jsxs("svg", __assign({ ref: svgReference, xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("defs", { children: _jsxs("mask", __assign({ id: "mask" }, { children: [_jsx("rect", { width: "100%", height: "100%", fill: "#fff" }), _jsx("image", __assign({ href: overlay }, framePosition))] })) }), overlay && _jsx("rect", { width: "100%", height: "100%", mask: "url(#mask)", fillOpacity: "0.72" }), outline && _jsx("image", __assign({ href: outline }, framePosition)), _jsx("foreignObject", __assign({ width: "100%", height: "100%" }, { children: _jsx("div", __assign({ className: "camera-capture-text-and-image-container" }, helperBoxPosition, { children: helperBox })) }))] })));
+};
+export default Overlay;

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

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

package/build/step/cameraStep/cameraCapture/screens/CameraNotSupported/CameraNotSupported.js

@@ -0,0 +1,19 @@
+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);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useIntl } from 'react-intl';
+import messages from './CameraNotSupported.messages';
+var CameraNotSupported = function () {
+    var intl = useIntl();
+    return (_jsx("div", __assign({ id: "camera-not-supported" }, { children: _jsx("div", __assign({ className: "container p-t-5" }, { children: _jsx("div", __assign({ className: "row" }, { children: _jsxs("div", __assign({ className: "col-md-6 col-md-offset-3" }, { children: [_jsx("h2", __assign({ className: "text-xs-center m-b-3" }, { children: intl.formatMessage(messages.title) })), _jsx("p", __assign({ className: "text-xs-center m-b-5" }, { children: intl.formatMessage(messages.paragraph) }))] })) })) })) })));
+};
+export default CameraNotSupported;

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

@@ -0,0 +1,13 @@
+declare const _default: {
+    title: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    paragraph: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export default _default;

package/build/step/cameraStep/cameraCapture/screens/CameraNotSupported/CameraNotSupported.messages.js

@@ -0,0 +1,13 @@
+import { defineMessages } from 'react-intl';
+export default defineMessages({
+    title: {
+        id: 'dynamicFlows.CameraCapture.CameraNotSupported.title',
+        defaultMessage: 'Camera not supported',
+        description: 'Title of standalone page prompting that camera is not available on users browser'
+    },
+    paragraph: {
+        id: 'dynamicFlows.CameraCapture.CameraNotSupported.paragraph',
+        defaultMessage: "The browser you're using doesn't have support for a camera. Try a different browser, device, or download our mobile app.",
+        description: "Further text of standalone page prompting that camera is not available on user's browser"
+    }
+});

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+type Props = {
+    onAction: () => void;
+};
+declare const NoCameraAccess: ({ onAction }: Props) => JSX.Element;
+export default NoCameraAccess;

package/build/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.js

@@ -0,0 +1,21 @@
+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);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '@transferwise/components';
+import { useIntl } from 'react-intl';
+import messages from './NoCameraAccess.messages';
+var NoCameraAccess = function (_a) {
+    var onAction = _a.onAction;
+    var intl = useIntl();
+    return (_jsx("div", __assign({ id: "no-camera-access" }, { children: _jsx("div", __assign({ className: "container p-t-5" }, { children: _jsx("div", __assign({ className: "row" }, { children: _jsxs("div", __assign({ className: "col-md-6 col-md-offset-3" }, { children: [_jsx("h2", __assign({ className: "text-xs-center m-b-3" }, { children: intl.formatMessage(messages.title) })), _jsx("p", __assign({ className: "text-xs-center m-b-5" }, { children: intl.formatMessage(messages.paragraph) })), _jsx(Button, __assign({ block: true, onClick: onAction }, { children: intl.formatMessage(messages.action) }))] })) })) })) })));
+};
+export default NoCameraAccess;

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

@@ -0,0 +1,18 @@
+declare const _default: {
+    title: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    paragraph: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    action: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export default _default;

package/build/step/cameraStep/cameraCapture/screens/NoCameraAccess/NoCameraAccess.messages.js

@@ -0,0 +1,18 @@
+import { defineMessages } from 'react-intl';
+export default defineMessages({
+    title: {
+        id: 'dynamicFlows.CameraCapture.NoCameraAccess.title',
+        defaultMessage: "We can't access your camera",
+        description: 'Title of standalone page prompting missing camera permissions'
+    },
+    paragraph: {
+        id: 'dynamicFlows.CameraCapture.NoCameraAccess.paragraph',
+        defaultMessage: "Enable camera access in your browser's settings to get going again.",
+        description: 'Further text of standalone page prompting missing camera permissions'
+    },
+    action: {
+        id: 'dynamicFlows.CameraCapture.NoCameraAccess.action',
+        defaultMessage: 'Enable camera access',
+        description: 'Action to ask for camera permissions again'
+    }
+});

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

@@ -0,0 +1,2 @@
+export { default as NoCameraAccess } from './NoCameraAccess/NoCameraAccess';
+export { default as CameraNotSupported } from './CameraNotSupported/CameraNotSupported';

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

@@ -0,0 +1,2 @@
+export { default as NoCameraAccess } from './NoCameraAccess/NoCameraAccess';
+export { default as CameraNotSupported } from './CameraNotSupported/CameraNotSupported';

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

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

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

@@ -0,0 +1,101 @@
+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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 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 }); };
+var getCameraStartedProperties = function (props, videoStream) { return __awaiter(void 0, void 0, void 0, function () {
+    var videoTrack, capabilities, settings, _a, _b, _c, _d;
+    var _e;
+    var _f;
+    return __generator(this, function (_g) {
+        switch (_g.label) {
+            case 0:
+                videoTrack = getVideoTrack(videoStream);
+                capabilities = getVideoCapabilities(videoStream);
+                settings = (_f = videoTrack === null || videoTrack === void 0 ? void 0 : videoTrack.getSettings) === null || _f === void 0 ? void 0 : _f.call(videoTrack);
+                _a = [{}];
+                _b = videoTrack;
+                if (!_b) return [3 /*break*/, 3];
+                _e = {};
+                _c = 'Available Video Devices (by label)';
+                return [4 /*yield*/, getAvailableVideoDeviceLabels()];
+            case 1:
+                _e[_c] = _g.sent();
+                _d = 'Active Video Device (by label)';
+                return [4 /*yield*/, getActiveVideoDeviceLabel(videoStream)];
+            case 2:
+                _b = (_e[_d] = _g.sent(),
+                    _e['Camera Capabilities'] = capabilities,
+                    _e['Camera Settings'] = settings,
+                    _e);
+                _g.label = 3;
+            case 3: return [2 /*return*/, __assign.apply(void 0, [__assign.apply(void 0, _a.concat([(_b)])), { 'Camera Direction (Asked)': props === null || props === void 0 ? void 0 : props.direction }])];
+        }
+    });
+}); };

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

@@ -0,0 +1,8 @@
+export declare const isSelfieCamera: (stream: MediaStream) => boolean;
+export declare const isMainBackCamera: (deviceInfo?: MediaDeviceInfo) => boolean;
+export declare const generateCanvasFromVideo: (video: HTMLVideoElement | null) => Promise<HTMLCanvasElement>;
+export declare const getAvailableVideoDevices: () => Promise<MediaDeviceInfo[]>;
+export declare const getAvailableVideoDeviceLabels: () => Promise<string[]>;
+export declare const getActiveVideoDeviceLabel: (videoStream: MediaStream) => Promise<string | undefined>;
+export declare const getVideoTrack: (videoStream: MediaStream) => MediaStreamTrack | undefined;
+export declare const getVideoCapabilities: (videoStream: MediaStream) => MediaTrackCapabilities | undefined;

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

@@ -0,0 +1,103 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+export var isSelfieCamera = function (stream) {
+    var _a;
+    var facingMode = (((_a = getVideoTrack(stream)) === null || _a === void 0 ? void 0 : _a.getSettings()) || {}).facingMode;
+    // facingMode === undefined for desktop users
+    return facingMode === 'user' || facingMode === undefined;
+};
+export var isMainBackCamera = function (deviceInfo) {
+    return !!((deviceInfo === null || deviceInfo === void 0 ? void 0 : deviceInfo.label) || '').match(/camera2? 0/g);
+};
+export var generateCanvasFromVideo = function (video) { return __awaiter(void 0, void 0, void 0, function () {
+    var canvas, context;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                canvas = document.createElement('canvas');
+                if (!video) return [3 /*break*/, 2];
+                canvas.setAttribute('height', "".concat(video.videoHeight));
+                canvas.setAttribute('width', "".concat(video.videoWidth));
+                context = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d');
+                if (!context) return [3 /*break*/, 2];
+                // Timeout is needed for intermittent iOS issue
+                return [4 /*yield*/, new Promise(function (resolve) { return setTimeout(resolve, 100); })];
+            case 1:
+                // Timeout is needed for intermittent iOS issue
+                _a.sent();
+                context.drawImage(video, 0, 0, canvas.width, canvas.height);
+                _a.label = 2;
+            case 2: return [2 /*return*/, canvas];
+        }
+    });
+}); };
+export var getAvailableVideoDevices = function () { return __awaiter(void 0, void 0, void 0, function () {
+    var _a, _b;
+    return __generator(this, function (_c) {
+        switch (_c.label) {
+            case 0: return [4 /*yield*/, ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.enumerateDevices) === null || _b === void 0 ? void 0 : _b.call(_a))];
+            case 1: return [2 /*return*/, ((_c.sent()) || []).filter(function (deviceInfo) { return deviceInfo.kind === 'videoinput'; })];
+        }
+    });
+}); };
+export var getAvailableVideoDeviceLabels = function () { return __awaiter(void 0, void 0, void 0, function () {
+    var _a, _b;
+    return __generator(this, function (_c) {
+        switch (_c.label) {
+            case 0: return [4 /*yield*/, ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.enumerateDevices) === null || _b === void 0 ? void 0 : _b.call(_a))];
+            case 1: return [2 /*return*/, ((_c.sent()) || [])
+                    .filter(function (deviceInfo) { return deviceInfo.kind === 'videoinput'; })
+                    .map(function (deviceInfo) { return deviceInfo.label; })];
+        }
+    });
+}); };
+export var getActiveVideoDeviceLabel = function (videoStream) { return __awaiter(void 0, void 0, void 0, function () {
+    var capabilities;
+    var _a, _b, _c;
+    return __generator(this, function (_d) {
+        switch (_d.label) {
+            case 0:
+                capabilities = getVideoCapabilities(videoStream);
+                return [4 /*yield*/, ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.enumerateDevices) === null || _b === void 0 ? void 0 : _b.call(_a))];
+            case 1: return [2 /*return*/, (_c = ((_d.sent()) || [])
+                    .filter(function (deviceInfo) { return deviceInfo.kind === 'videoinput'; })
+                    .find(function (deviceInfo) { return deviceInfo.deviceId === (capabilities === null || capabilities === void 0 ? void 0 : capabilities.deviceId); })) === null || _c === void 0 ? void 0 : _c.label];
+        }
+    });
+}); };
+export var getVideoTrack = function (videoStream) { var _a; return (((_a = videoStream === null || videoStream === void 0 ? void 0 : videoStream.getVideoTracks) === null || _a === void 0 ? void 0 : _a.call(videoStream)) || [])[0]; };
+export var getVideoCapabilities = function (videoStream) { var _a, _b; return (_b = (_a = getVideoTrack(videoStream)) === null || _a === void 0 ? void 0 : _a.getCapabilities) === null || _b === void 0 ? void 0 : _b.call(_a); };

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

@@ -0,0 +1 @@
+export { default } from './CameraStep';

package/build/step/cameraStep/index.js

@@ -0,0 +1 @@
+export { default } from './CameraStep';

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type Props = {
+    url: string;
+    onClose: () => void;
+};
+declare const ExternalConfirmationStep: ({ url, onClose }: Props) => JSX.Element;
+export default ExternalConfirmationStep;

package/build/step/externalConfirmationStep/ExternalConfirmationStep.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIntl } from 'react-intl';
+import DynamicLayout from '../../layout/DynamicLayout';
+import messages from './ExternalConfirmationStep.messages';
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+var noop = function () { };
+var ExternalConfirmationStep = function (_a) {
+    var url = _a.url, onClose = _a.onClose;
+    var formatMessage = useIntl().formatMessage;
+    return (_jsx(DynamicLayout, { components: [
+            {
+                type: 'box',
+                width: 'lg',
+                components: [
+                    {
+                        type: 'heading',
+                        text: formatMessage(messages.title),
+                        size: 'lg',
+                        align: 'center',
+                        margin: 'xl'
+                    },
+                    {
+                        type: 'info',
+                        markdown: formatMessage(messages.description, { origin: getOrigin(url) }),
+                        align: 'center',
+                        margin: 'xl'
+                    },
+                    {
+                        type: 'box',
+                        width: 'md',
+                        components: [
+                            {
+                                type: 'button',
+                                action: { title: formatMessage(messages.open), type: 'primary', url: url, exit: true }
+                            },
+                            {
+                                type: 'button',
+                                action: {
+                                    title: formatMessage(messages.cancel),
+                                    type: 'link',
+                                    url: '',
+                                    exit: true
+                                }
+                            },
+                        ]
+                    },
+                ]
+            },
+        ], submitted: false, onAction: function (action) {
+            if (action.url) {
+                window.open(action.url, '_blank');
+            }
+            onClose();
+        }, onModelChange: noop, onPersistAsync: noop }));
+};
+export default ExternalConfirmationStep;
+function getOrigin(url) {
+    try {
+        return new URL(url).origin;
+    }
+    catch (_a) {
+        return url;
+    }
+}

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

@@ -0,0 +1,23 @@
+declare const _default: {
+    title: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    description: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    open: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    cancel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export default _default;

package/build/step/externalConfirmationStep/ExternalConfirmationStep.messages.js

@@ -0,0 +1,23 @@
+import { defineMessages } from 'react-intl';
+export default defineMessages({
+    title: {
+        id: 'dynamicFlows.ExternalConfirmation.title',
+        defaultMessage: 'Please confirm',
+        description: 'Heading for the confirmation screen.'
+    },
+    description: {
+        id: 'dynamicFlows.ExternalConfirmation.description',
+        defaultMessage: 'Please confirm you want to open **{origin}** in a new browser tab.',
+        description: 'Description for the confirmation screen.'
+    },
+    open: {
+        id: 'dynamicFlows.ExternalConfirmation.open',
+        defaultMessage: 'Open in new tab',
+        description: 'Button text confirming opening a new browser tab.'
+    },
+    cancel: {
+        id: 'dynamicFlows.ExternalConfirmation.cancel',
+        defaultMessage: 'Cancel',
+        description: 'Button text rejecting opening a new browser tab.'
+    }
+});

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

@@ -0,0 +1 @@
+export { default } from './ExternalConfirmationStep';

package/build/step/externalConfirmationStep/index.js

@@ -0,0 +1 @@
+export { default } from './ExternalConfirmationStep';

package/build/step/features/external/useExternal.d.ts

@@ -0,0 +1,4 @@
+export declare function useExternal(url?: string): {
+    requiresManualTrigger: boolean;
+    dismissConfirmation: () => void;
+};

package/build/step/features/external/useExternal.js

@@ -0,0 +1,15 @@
+import { useEffect, useState } from 'react';
+export function useExternal(url) {
+    // If we fail to open the window, the user will need to open this on their own
+    var _a = useState(null), externalWindow = _a[0], setExternalWindow = _a[1];
+    var _b = useState(false), hasManuallyTriggered = _b[0], setHasManuallyTriggered = _b[1];
+    var dismissConfirmation = function () { return setHasManuallyTriggered(true); };
+    useEffect(function () {
+        if (url) {
+            setHasManuallyTriggered(false);
+            setExternalWindow(window.open(url, '_blank'));
+        }
+    }, [url]);
+    var requiresManualTrigger = Boolean(url && !externalWindow && !hasManuallyTriggered);
+    return { requiresManualTrigger: requiresManualTrigger, dismissConfirmation: dismissConfirmation };
+}

package/build/step/features/index.d.ts

@@ -0,0 +1,2 @@
+export { useExternal } from './external/useExternal';
+export { useStepPolling } from './polling/useStepPolling';

package/build/step/features/index.js

@@ -0,0 +1,2 @@
+export { useExternal } from './external/useExternal';
+export { useStepPolling } from './polling/useStepPolling';

package/build/step/features/polling/useStepPolling.d.ts

@@ -0,0 +1,2 @@
+import { Action, PollingConfiguration } from '../../../dynamic-flow-types';
+export declare function useStepPolling(polling: PollingConfiguration | undefined, onAction: (action: Action) => void): void;