@monkvision/camera-web 5.2.5 → 5.3.1

package/lib/Camera/Camera.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { AllOrNone, CameraConfig, RequiredKeys } from '@monkvision/types';
 import { CameraMonitoringConfig } from './monitoring';
 import { CameraEventHandlers, CameraHUDComponent } from './CameraHUD.types';
@@ -49,4 +48,4 @@ export type CameraProps<T extends object> = CameraConfig & CameraEventHandlers &
  * [here](https://github.com/monkvision/monkjs/blob/main/packages/camera-web/README.md)) for more details on how this
  * component works.
  */
-export declare function Camera<T extends object>({ resolution, format, quality, allowImageUpscaling, HUDComponent, hudProps, monitoring, onPictureTaken, }: CameraProps<T>): JSX.Element;
+export declare function Camera<T extends object>({ resolution, format, quality, allowImageUpscaling, HUDComponent, hudProps, monitoring, onPictureTaken, }: CameraProps<T>): import("react/jsx-runtime").JSX.Element;

package/lib/Camera/Camera.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Camera = void 0;
+exports.Camera = Camera;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var types_1 = require("@monkvision/types");
@@ -55,7 +55,7 @@ function Camera(_a) {
         selectedCameraDeviceId: selectedCameraDeviceId,
     }), takePicture = _h.takePicture, isTakePictureLoading = _h.isLoading;
     var isLoading = isPreviewLoading || isTakePictureLoading;
-    var cameraPreview = (0, react_1.useMemo)(function () { return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: Camera_styles_1.styles['container'] }, { children: [(0, jsx_runtime_1.jsx)("video", { style: Camera_styles_1.styles['cameraPreview'], ref: videoRef, autoPlay: true, playsInline: true, controls: false, muted: true, "data-testid": 'camera-video-preview' }), (0, jsx_runtime_1.jsx)("canvas", { ref: canvasRef, style: Camera_styles_1.styles['cameraCanvas'], "data-testid": 'camera-canvas' })] }))); }, []);
+    var cameraPreview = (0, react_1.useMemo)(function () { return ((0, jsx_runtime_1.jsxs)("div", { style: Camera_styles_1.styles['container'], children: [(0, jsx_runtime_1.jsx)("video", { style: Camera_styles_1.styles['cameraPreview'], ref: videoRef, autoPlay: true, playsInline: true, controls: false, muted: true, "data-testid": 'camera-video-preview' }), (0, jsx_runtime_1.jsx)("canvas", { ref: canvasRef, style: Camera_styles_1.styles['cameraCanvas'], "data-testid": 'camera-canvas' })] })); }, []);
     var getImageData = (0, react_1.useCallback)(function () { return takeScreenshot(); }, [takeScreenshot]);
     var compressImage = (0, react_1.useCallback)(function (image) { return compress(image); }, [compress]);
     return HUDComponent ? ((0, jsx_runtime_1.jsx)(HUDComponent, __assign({ handle: {
@@ -69,4 +69,3 @@ function Camera(_a) {
             previewDimensions: previewDimensions,
         }, cameraPreview: cameraPreview }, (hudProps !== null && hudProps !== void 0 ? hudProps : {})))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: cameraPreview }));
 }
-exports.Camera = Camera;

package/lib/Camera/hooks/useCameraCanvas.d.ts

@@ -25,7 +25,7 @@ export interface CameraCanvasHandle {
     /**
      * The ref to the canvas element. Forward this ref to the <canvas> tag to set it up.
      */
-    ref: RefObject<HTMLCanvasElement>;
+    ref: RefObject<HTMLCanvasElement | null>;
     /**
      * The dimensions of the canvas.
      */

package/lib/Camera/hooks/useCameraCanvas.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCameraCanvas = void 0;
+exports.useCameraCanvas = useCameraCanvas;
 var react_1 = require("react");
 var utils_1 = require("./utils");
 /**
@@ -54,4 +54,3 @@ function useCameraCanvas(_a) {
     }, [handle.dimensions]);
     return handle;
 }
-exports.useCameraCanvas = useCameraCanvas;

package/lib/Camera/hooks/useCameraPreview.d.ts

@@ -13,7 +13,7 @@ export interface CameraPreviewHandle extends UserMediaResult {
     /**
      * React MutableRefObject referencing the video element displaying the camera preview.
      */
-    ref: RefObject<HTMLVideoElement>;
+    ref: RefObject<HTMLVideoElement | null>;
 }
 /**
  * Custom hook used to initialize and handle the camera preview. It initializes the camera stream based on the given

package/lib/Camera/hooks/useCameraPreview.js

@@ -11,16 +11,15 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCameraPreview = void 0;
+exports.useCameraPreview = useCameraPreview;
 var monitoring_1 = require("@monkvision/monitoring");
 var react_1 = require("react");
 var common_1 = require("@monkvision/common");
 var utils_1 = require("./utils");
 var useUserMedia_1 = require("./useUserMedia");
 function getPreviewDimensions(refVideo, windowDimensions) {
-    var _a, _b;
-    var height = (_a = refVideo.current) === null || _a === void 0 ? void 0 : _a.videoHeight;
-    var width = (_b = refVideo.current) === null || _b === void 0 ? void 0 : _b.videoWidth;
+    var height = refVideo.videoHeight;
+    var width = refVideo.videoWidth;
     if (!windowDimensions || !height || !width) {
         return null;
     }
@@ -52,10 +51,14 @@ function useCameraPreview(config) {
             currentRef.srcObject = userMediaResult.stream;
             var handleMetadata = function () {
                 currentRef === null || currentRef === void 0 ? void 0 : currentRef.play().catch(handleError);
-                setPreviewDimensions(getPreviewDimensions(ref, windowDimensions));
+                if (currentRef) {
+                    setPreviewDimensions(getPreviewDimensions(currentRef, windowDimensions));
+                }
             };
             var handleResize = function () {
-                setPreviewDimensions(getPreviewDimensions(ref, windowDimensions));
+                if (currentRef) {
+                    setPreviewDimensions(getPreviewDimensions(currentRef, windowDimensions));
+                }
             };
             currentRef.onloadedmetadata = handleMetadata;
             currentRef.onresize = handleResize;
@@ -69,4 +72,3 @@ function useCameraPreview(config) {
     }, [windowDimensions, userMediaResult.stream, handleError]);
     return (0, react_1.useMemo)(function () { return (__assign({ ref: ref, previewDimensions: previewDimensions }, userMediaResult)); }, [previewDimensions, userMediaResult]);
 }
-exports.useCameraPreview = useCameraPreview;

package/lib/Camera/hooks/useCameraScreenshot.d.ts

@@ -8,11 +8,11 @@ export interface CameraScreenshotConfig {
     /**
      * The ref to the video element to take screenshots of.
      */
-    videoRef: RefObject<HTMLVideoElement>;
+    videoRef: RefObject<HTMLVideoElement | null>;
     /**
      * The ref to the canvas element used to draw the screenshots
      */
-    canvasRef: RefObject<HTMLCanvasElement>;
+    canvasRef: RefObject<HTMLCanvasElement | null>;
     /**
      * The dimensions of the screenshot.
      */

package/lib/Camera/hooks/useCameraScreenshot.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCameraScreenshot = void 0;
+exports.useCameraScreenshot = useCameraScreenshot;
 var react_1 = require("react");
 var monitoring_1 = require("@monkvision/monitoring");
 var monitoring_2 = require("../monitoring");
@@ -62,4 +62,3 @@ function useCameraScreenshot(_a) {
         return imageData;
     }, [dimensions]);
 }
-exports.useCameraScreenshot = useCameraScreenshot;

package/lib/Camera/hooks/useCompression.d.ts

@@ -8,7 +8,7 @@ export interface UseCompressionParams {
     /**
      * The ref to the canvas element used to draw and compress the image.
      */
-    canvasRef: RefObject<HTMLCanvasElement>;
+    canvasRef: RefObject<HTMLCanvasElement | null>;
     /**
      * The compression options.
      */

package/lib/Camera/hooks/useCompression.js

@@ -20,8 +20,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 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;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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.");
@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCompression = void 0;
+exports.useCompression = useCompression;
 var monitoring_1 = require("@monkvision/monitoring");
 var react_1 = require("react");
 var monitoring_2 = require("../monitoring");
@@ -122,4 +122,3 @@ function useCompression(_a) {
         });
     }); }, [options.format, options.quality]);
 }
-exports.useCompression = useCompression;

package/lib/Camera/hooks/useTakePicture.js

@@ -20,8 +20,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 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;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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.");
@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTakePicture = void 0;
+exports.useTakePicture = useTakePicture;
 var monitoring_1 = require("@monkvision/monitoring");
 var common_1 = require("@monkvision/common");
 var react_1 = require("react");
@@ -96,4 +96,3 @@ function useTakePicture(_a) {
     }); }, [createTransaction, monitoring, takeScreenshot, compress, onPictureTaken]);
     return (0, common_1.useObjectMemo)({ takePicture: takePicture, isLoading: isLoading });
 }
-exports.useTakePicture = useTakePicture;

package/lib/Camera/hooks/useUserMedia.d.ts

@@ -126,4 +126,4 @@ export interface UserMediaResult {
  * for more information.
  * @see UserMediaResult
  */
-export declare function useUserMedia(constraints: MediaStreamConstraints, videoRef: RefObject<HTMLVideoElement> | null): UserMediaResult;
+export declare function useUserMedia(constraints: MediaStreamConstraints, videoRef: RefObject<HTMLVideoElement | null> | null): UserMediaResult;

package/lib/Camera/hooks/useUserMedia.js

@@ -35,8 +35,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 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;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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.");
@@ -65,7 +65,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useUserMedia = exports.UserMediaErrorType = exports.InvalidStreamErrorName = void 0;
+exports.UserMediaErrorType = exports.InvalidStreamErrorName = void 0;
+exports.useUserMedia = useUserMedia;
 var monitoring_1 = require("@monkvision/monitoring");
 var fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
 var react_1 = require("react");
@@ -84,7 +85,7 @@ var InvalidStreamErrorName;
      * The stream had too many video tracks (more than one).
      */
     InvalidStreamErrorName["TOO_MANY_VIDEO_TRACKS"] = "TooManyVideoTracks";
-})(InvalidStreamErrorName = exports.InvalidStreamErrorName || (exports.InvalidStreamErrorName = {}));
+})(InvalidStreamErrorName || (exports.InvalidStreamErrorName = InvalidStreamErrorName = {}));
 var InvalidStreamError = /** @class */ (function (_super) {
     __extends(InvalidStreamError, _super);
     function InvalidStreamError(message, name) {
@@ -137,7 +138,7 @@ var UserMediaErrorType;
      * Any other error.
      */
     UserMediaErrorType["OTHER"] = "other";
-})(UserMediaErrorType = exports.UserMediaErrorType || (exports.UserMediaErrorType = {}));
+})(UserMediaErrorType || (exports.UserMediaErrorType = UserMediaErrorType = {}));
 function getStreamVideoTrackSettings(stream) {
     var videoTracks = stream.getVideoTracks();
     if (videoTracks.length === 0) {
@@ -228,10 +229,6 @@ function useUserMedia(constraints, videoRef) {
             switch (_a.label) {
                 case 0:
                     setIsLoading(true);
-                    if (stream) {
-                        stream.removeEventListener('inactive', onStreamInactive);
-                        stream.getTracks().forEach(function (track) { return track.stop(); });
-                    }
                     return [4 /*yield*/, (0, utils_1.analyzeCameraDevices)(constraints)];
                 case 1:
                     deviceDetails = _a.sent();
@@ -312,8 +309,9 @@ function useUserMedia(constraints, videoRef) {
     }, [constraints, stream, error, isLoading, lastConstraintsApplied, getUserMedia, videoRef]);
     (0, react_1.useEffect)(function () {
         return function () {
-            var _a;
-            (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach(function (track) {
+            var _a, _b;
+            (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('inactive', onStreamInactive);
+            (_b = streamRef.current) === null || _b === void 0 ? void 0 : _b.getTracks().forEach(function (track) {
                 track.stop();
             });
         };
@@ -328,4 +326,3 @@ function useUserMedia(constraints, videoRef) {
         selectedCameraDeviceId: selectedCameraDeviceId,
     });
 }
-exports.useUserMedia = useUserMedia;

package/lib/Camera/hooks/utils/analyzeCameraDevices.js

@@ -9,8 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 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;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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.");
@@ -36,7 +36,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.analyzeCameraDevices = void 0;
+exports.analyzeCameraDevices = analyzeCameraDevices;
 function isVideoRecordingDevice(device) {
     return device.kind === 'videoinput';
 }
@@ -71,4 +71,3 @@ function analyzeCameraDevices(constraints) {
         });
     });
 }
-exports.analyzeCameraDevices = analyzeCameraDevices;

package/lib/Camera/hooks/utils/getCanvasHandle.d.ts

@@ -15,4 +15,4 @@ export interface CanvasHandle {
 /**
  * Utility function used to retreive a canvas handle or throw if it is not available.
  */
-export declare function getCanvasHandle(ref: RefObject<HTMLCanvasElement>, onError?: (err: Error) => void): CanvasHandle;
+export declare function getCanvasHandle(ref: RefObject<HTMLCanvasElement | null>, onError?: (err: Error) => void): CanvasHandle;

package/lib/Camera/hooks/utils/getCanvasHandle.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getCanvasHandle = void 0;
+exports.getCanvasHandle = getCanvasHandle;
 /**
  * Utility function used to retreive a canvas handle or throw if it is not available.
  */
@@ -25,4 +25,3 @@ function getCanvasHandle(ref, onError) {
     }
     return { canvas: ref.current, context: context };
 }
-exports.getCanvasHandle = getCanvasHandle;

package/lib/Camera/hooks/utils/getMediaContraints.js

@@ -1,7 +1,9 @@
 "use strict";
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getMediaConstraints = exports.getResolutionDimensions = exports.CameraFacingMode = void 0;
+exports.CameraFacingMode = void 0;
+exports.getResolutionDimensions = getResolutionDimensions;
+exports.getMediaConstraints = getMediaConstraints;
 var types_1 = require("@monkvision/types");
 /**
  * Enumeration of the facing modes for the camera constraints.
@@ -16,7 +18,7 @@ var CameraFacingMode;
      * Enironment-facing camera (back camera).
      */
     CameraFacingMode["ENVIRONMENT"] = "environment";
-})(CameraFacingMode = exports.CameraFacingMode || (exports.CameraFacingMode = {}));
+})(CameraFacingMode || (exports.CameraFacingMode = CameraFacingMode = {}));
 var CAMERA_RESOLUTION_DIMENSIONS = (_a = {},
     _a[types_1.CameraResolution.QNHD_180P] = { width: 320, height: 180 },
     _a[types_1.CameraResolution.NHD_360P] = { width: 640, height: 360 },
@@ -36,7 +38,6 @@ function getResolutionDimensions(resolution, isPortrait) {
         height: isPortrait ? dimensions.width : dimensions.height,
     };
 }
-exports.getResolutionDimensions = getResolutionDimensions;
 /**
  * This function is used by the Monk Camera package in order to add a layer of abstraction to the media constraints
  * passed to the `useUserMedia` hook. It takes an optional `CameraOptions` parameter and creates a
@@ -58,4 +59,3 @@ function getMediaConstraints(config) {
         video: video,
     };
 }
-exports.getMediaConstraints = getMediaConstraints;

package/lib/SimpleCameraHUD/SimpleCameraHUD.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CameraHUDProps } from '../Camera';
 /**
  * Props accepted by the SimpleCameraHUD component.
@@ -21,5 +20,5 @@ export declare const SimpleCameraHUD: import("react").ForwardRefExoticComponent<
      *
      * @default: en
      */
-    lang?: string | null | undefined;
+    lang?: string | null;
 } & import("react").RefAttributes<unknown>>;

package/lib/SimpleCameraHUD/SimpleCameraHUD.js

@@ -32,5 +32,5 @@ exports.SimpleCameraHUD = (0, common_1.i18nWrap)(function SimpleCameraHUD(_a) {
     var responsive = (0, common_1.useResponsiveStyle)().responsive;
     var isHUDDisabled = handle.isLoading || !!handle.error;
     var errorLabel = (0, utils_1.getCameraErrorLabel)((_b = handle.error) === null || _b === void 0 ? void 0 : _b.type);
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['container']), responsive(SimpleCameraHUD_styles_1.styles['containerPortrait'])) }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ style: SimpleCameraHUD_styles_1.styles['previewContainer'] }, { children: cameraPreview })), !handle.isLoading && !!handle.error && errorLabel && ((0, jsx_runtime_1.jsxs)("div", __assign({ style: SimpleCameraHUD_styles_1.styles['messageContainer'] }, { children: [(0, jsx_runtime_1.jsx)("div", __assign({ "data-testid": 'error-message', style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['errorMessage']), responsive(SimpleCameraHUD_styles_1.styles['errorMessagePortrait'])) }, { children: tObj(errorLabel) })), (0, jsx_runtime_1.jsx)(common_ui_web_1.Button, __assign({ style: SimpleCameraHUD_styles_1.styles['retryButton'], variant: 'outline', icon: 'refresh', onClick: handle.retry }, { children: t('retry') }))] }))), (0, jsx_runtime_1.jsx)(common_ui_web_1.TakePictureButton, { style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['takePictureButton']), responsive(SimpleCameraHUD_styles_1.styles['takePicturePortrait'])), disabled: isHUDDisabled, onClick: handle.takePicture, size: 60 })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['container']), responsive(SimpleCameraHUD_styles_1.styles['containerPortrait'])), children: [(0, jsx_runtime_1.jsx)("div", { style: SimpleCameraHUD_styles_1.styles['previewContainer'], children: cameraPreview }), !handle.isLoading && !!handle.error && errorLabel && ((0, jsx_runtime_1.jsxs)("div", { style: SimpleCameraHUD_styles_1.styles['messageContainer'], children: [(0, jsx_runtime_1.jsx)("div", { "data-testid": 'error-message', style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['errorMessage']), responsive(SimpleCameraHUD_styles_1.styles['errorMessagePortrait'])), children: tObj(errorLabel) }), (0, jsx_runtime_1.jsx)(common_ui_web_1.Button, { style: SimpleCameraHUD_styles_1.styles['retryButton'], variant: 'outline', icon: 'refresh', onClick: handle.retry, children: t('retry') })] })), (0, jsx_runtime_1.jsx)(common_ui_web_1.TakePictureButton, { style: __assign(__assign({}, SimpleCameraHUD_styles_1.styles['takePictureButton']), responsive(SimpleCameraHUD_styles_1.styles['takePicturePortrait'])), disabled: isHUDDisabled, onClick: handle.takePicture, size: 60 })] }));
 }, i18n_1.i18nCamera);

package/lib/hooks/useCameraPermission.js

@@ -9,8 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 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;
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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.");
@@ -36,7 +36,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     }
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCameraPermission = void 0;
+exports.useCameraPermission = useCameraPermission;
 var react_1 = require("react");
 var common_1 = require("@monkvision/common");
 var types_1 = require("@monkvision/types");
@@ -69,4 +69,3 @@ function useCameraPermission() {
     }); }, [getUserMedia]);
     return (0, common_1.useObjectMemo)({ requestCameraPermission: requestCameraPermission });
 }
-exports.useCameraPermission = useCameraPermission;

package/lib/utils/errors.utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getCameraErrorLabel = void 0;
+exports.getCameraErrorLabel = getCameraErrorLabel;
 var Camera_1 = require("../Camera");
 /**
  * Get a translation object (that can be translated using the useObjectTranslation hook) that contains the translations
@@ -58,4 +58,3 @@ function getCameraErrorLabel(error) {
             };
     }
 }
-exports.getCameraErrorLabel = getCameraErrorLabel;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monkvision/camera-web",
-  "version": "5.2.5",
+  "version": "5.3.1",
   "license": "BSD-3-Clause-Clear",
   "packageManager": "yarn@3.2.4",
   "description": "MonkJs camera package for React (web) used to display a camera preview and take pictures",
@@ -28,32 +28,31 @@
     "lint:fix": "yarn run prettier:fix && yarn run eslint:fix"
   },
   "dependencies": {
-    "@monkvision/common": "5.2.5",
-    "@monkvision/common-ui-web": "5.2.5",
-    "@monkvision/monitoring": "5.2.5",
+    "@monkvision/common": "5.3.1",
+    "@monkvision/common-ui-web": "5.3.1",
+    "@monkvision/monitoring": "5.3.1",
     "fast-deep-equal": "^3.1.3",
     "i18next": "^23.4.5",
     "react-i18next": "^13.2.0"
   },
   "peerDependencies": {
     "@auth0/auth0-react": "^2.2.4",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
     "react-router-dom": "^6.22.3"
   },
   "devDependencies": {
-    "@monkvision/eslint-config-base": "5.2.5",
-    "@monkvision/eslint-config-typescript": "5.2.5",
-    "@monkvision/eslint-config-typescript-react": "5.2.5",
-    "@monkvision/jest-config": "5.2.5",
-    "@monkvision/prettier-config": "5.2.5",
-    "@monkvision/test-utils": "5.2.5",
-    "@monkvision/typescript-config": "5.2.5",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/react-hooks": "^8.0.1",
+    "@monkvision/eslint-config-base": "5.3.1",
+    "@monkvision/eslint-config-typescript": "5.3.1",
+    "@monkvision/eslint-config-typescript-react": "5.3.1",
+    "@monkvision/jest-config": "5.3.1",
+    "@monkvision/prettier-config": "5.3.1",
+    "@monkvision/test-utils": "5.3.1",
+    "@monkvision/typescript-config": "5.3.1",
+    "@testing-library/react": "^16.3.0",
     "@types/fscreen": "^1.0.1",
-    "@types/jest": "^29.2.2",
-    "@types/node": "^18.11.9",
+    "@types/jest": "^30",
+    "@types/node": "^24.5.2",
     "@typescript-eslint/eslint-plugin": "^5.43.0",
     "@typescript-eslint/parser": "^5.43.0",
     "eslint": "^8.29.0",
@@ -69,14 +68,14 @@
     "eslint-plugin-react": "^7.27.1",
     "eslint-plugin-react-hooks": "^4.3.0",
     "eslint-utils": "^3.0.0",
-    "jest": "^29.3.1",
-    "jest-environment-jsdom": "^29.6.2",
+    "jest": "^30.2",
+    "jest-environment-jsdom": "^30.2",
     "mkdirp": "^1.0.4",
     "prettier": "^2.7.1",
     "regexpp": "^3.2.0",
     "rimraf": "^3.0.2",
-    "ts-jest": "^29.0.3",
-    "typescript": "^4.8.4"
+    "ts-jest": "^29.4.6",
+    "typescript": "^5.9.2"
   },
   "prettier": "@monkvision/prettier-config",
   "publishConfig": {
@@ -90,5 +89,5 @@
     "url": "https://github.com/monkvision/monkjs/issues"
   },
   "homepage": "https://github.com/monkvision/monkjs",
-  "gitHead": "0e1d8f131227954e588e0cd014ff141de1060343"
+  "gitHead": "859c252dd8e45c5aa4755f28f90fd4163e6cb8f6"
 }