@monkvision/camera-web 5.2.5 → 5.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { AllOrNone, CameraConfig, RequiredKeys } from '@monkvision/types';
3
2
  import { CameraMonitoringConfig } from './monitoring';
4
3
  import { CameraEventHandlers, CameraHUDComponent } from './CameraHUD.types';
@@ -49,4 +48,4 @@ export type CameraProps<T extends object> = CameraConfig & CameraEventHandlers &
49
48
  * [here](https://github.com/monkvision/monkjs/blob/main/packages/camera-web/README.md)) for more details on how this
50
49
  * component works.
51
50
  */
52
- export declare function Camera<T extends object>({ resolution, format, quality, allowImageUpscaling, HUDComponent, hudProps, monitoring, onPictureTaken, }: CameraProps<T>): JSX.Element;
51
+ export declare function Camera<T extends object>({ resolution, format, quality, allowImageUpscaling, HUDComponent, hudProps, monitoring, onPictureTaken, }: CameraProps<T>): import("react/jsx-runtime").JSX.Element;
@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
- exports.Camera = void 0;
14
+ exports.Camera = Camera;
15
15
  var jsx_runtime_1 = require("react/jsx-runtime");
16
16
  var react_1 = require("react");
17
17
  var types_1 = require("@monkvision/types");
@@ -55,7 +55,7 @@ function Camera(_a) {
55
55
  selectedCameraDeviceId: selectedCameraDeviceId,
56
56
  }), takePicture = _h.takePicture, isTakePictureLoading = _h.isLoading;
57
57
  var isLoading = isPreviewLoading || isTakePictureLoading;
58
- 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' })] }))); }, []);
58
+ 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' })] })); }, []);
59
59
  var getImageData = (0, react_1.useCallback)(function () { return takeScreenshot(); }, [takeScreenshot]);
60
60
  var compressImage = (0, react_1.useCallback)(function (image) { return compress(image); }, [compress]);
61
61
  return HUDComponent ? ((0, jsx_runtime_1.jsx)(HUDComponent, __assign({ handle: {
@@ -69,4 +69,3 @@ function Camera(_a) {
69
69
  previewDimensions: previewDimensions,
70
70
  }, cameraPreview: cameraPreview }, (hudProps !== null && hudProps !== void 0 ? hudProps : {})))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: cameraPreview }));
71
71
  }
72
- exports.Camera = Camera;
@@ -25,7 +25,7 @@ export interface CameraCanvasHandle {
25
25
  /**
26
26
  * The ref to the canvas element. Forward this ref to the <canvas> tag to set it up.
27
27
  */
28
- ref: RefObject<HTMLCanvasElement>;
28
+ ref: RefObject<HTMLCanvasElement | null>;
29
29
  /**
30
30
  * The dimensions of the canvas.
31
31
  */
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useCameraCanvas = void 0;
3
+ exports.useCameraCanvas = useCameraCanvas;
4
4
  var react_1 = require("react");
5
5
  var utils_1 = require("./utils");
6
6
  /**
@@ -54,4 +54,3 @@ function useCameraCanvas(_a) {
54
54
  }, [handle.dimensions]);
55
55
  return handle;
56
56
  }
57
- exports.useCameraCanvas = useCameraCanvas;
@@ -13,7 +13,7 @@ export interface CameraPreviewHandle extends UserMediaResult {
13
13
  /**
14
14
  * React MutableRefObject referencing the video element displaying the camera preview.
15
15
  */
16
- ref: RefObject<HTMLVideoElement>;
16
+ ref: RefObject<HTMLVideoElement | null>;
17
17
  }
18
18
  /**
19
19
  * Custom hook used to initialize and handle the camera preview. It initializes the camera stream based on the given
@@ -11,16 +11,15 @@ var __assign = (this && this.__assign) || function () {
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
- exports.useCameraPreview = void 0;
14
+ exports.useCameraPreview = useCameraPreview;
15
15
  var monitoring_1 = require("@monkvision/monitoring");
16
16
  var react_1 = require("react");
17
17
  var common_1 = require("@monkvision/common");
18
18
  var utils_1 = require("./utils");
19
19
  var useUserMedia_1 = require("./useUserMedia");
20
20
  function getPreviewDimensions(refVideo, windowDimensions) {
21
- var _a, _b;
22
- var height = (_a = refVideo.current) === null || _a === void 0 ? void 0 : _a.videoHeight;
23
- var width = (_b = refVideo.current) === null || _b === void 0 ? void 0 : _b.videoWidth;
21
+ var height = refVideo.videoHeight;
22
+ var width = refVideo.videoWidth;
24
23
  if (!windowDimensions || !height || !width) {
25
24
  return null;
26
25
  }
@@ -52,10 +51,14 @@ function useCameraPreview(config) {
52
51
  currentRef.srcObject = userMediaResult.stream;
53
52
  var handleMetadata = function () {
54
53
  currentRef === null || currentRef === void 0 ? void 0 : currentRef.play().catch(handleError);
55
- setPreviewDimensions(getPreviewDimensions(ref, windowDimensions));
54
+ if (currentRef) {
55
+ setPreviewDimensions(getPreviewDimensions(currentRef, windowDimensions));
56
+ }
56
57
  };
57
58
  var handleResize = function () {
58
- setPreviewDimensions(getPreviewDimensions(ref, windowDimensions));
59
+ if (currentRef) {
60
+ setPreviewDimensions(getPreviewDimensions(currentRef, windowDimensions));
61
+ }
59
62
  };
60
63
  currentRef.onloadedmetadata = handleMetadata;
61
64
  currentRef.onresize = handleResize;
@@ -69,4 +72,3 @@ function useCameraPreview(config) {
69
72
  }, [windowDimensions, userMediaResult.stream, handleError]);
70
73
  return (0, react_1.useMemo)(function () { return (__assign({ ref: ref, previewDimensions: previewDimensions }, userMediaResult)); }, [previewDimensions, userMediaResult]);
71
74
  }
72
- exports.useCameraPreview = useCameraPreview;
@@ -8,11 +8,11 @@ export interface CameraScreenshotConfig {
8
8
  /**
9
9
  * The ref to the video element to take screenshots of.
10
10
  */
11
- videoRef: RefObject<HTMLVideoElement>;
11
+ videoRef: RefObject<HTMLVideoElement | null>;
12
12
  /**
13
13
  * The ref to the canvas element used to draw the screenshots
14
14
  */
15
- canvasRef: RefObject<HTMLCanvasElement>;
15
+ canvasRef: RefObject<HTMLCanvasElement | null>;
16
16
  /**
17
17
  * The dimensions of the screenshot.
18
18
  */
@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
- exports.useCameraScreenshot = void 0;
14
+ exports.useCameraScreenshot = useCameraScreenshot;
15
15
  var react_1 = require("react");
16
16
  var monitoring_1 = require("@monkvision/monitoring");
17
17
  var monitoring_2 = require("../monitoring");
@@ -62,4 +62,3 @@ function useCameraScreenshot(_a) {
62
62
  return imageData;
63
63
  }, [dimensions]);
64
64
  }
65
- exports.useCameraScreenshot = useCameraScreenshot;
@@ -8,7 +8,7 @@ export interface UseCompressionParams {
8
8
  /**
9
9
  * The ref to the canvas element used to draw and compress the image.
10
10
  */
11
- canvasRef: RefObject<HTMLCanvasElement>;
11
+ canvasRef: RefObject<HTMLCanvasElement | null>;
12
12
  /**
13
13
  * The compression options.
14
14
  */
@@ -20,8 +20,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
20
20
  });
21
21
  };
22
22
  var __generator = (this && this.__generator) || function (thisArg, body) {
23
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
24
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
23
+ 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);
24
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
25
25
  function verb(n) { return function (v) { return step([n, v]); }; }
26
26
  function step(op) {
27
27
  if (f) throw new TypeError("Generator is already executing.");
@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
47
47
  }
48
48
  };
49
49
  Object.defineProperty(exports, "__esModule", { value: true });
50
- exports.useCompression = void 0;
50
+ exports.useCompression = useCompression;
51
51
  var monitoring_1 = require("@monkvision/monitoring");
52
52
  var react_1 = require("react");
53
53
  var monitoring_2 = require("../monitoring");
@@ -122,4 +122,3 @@ function useCompression(_a) {
122
122
  });
123
123
  }); }, [options.format, options.quality]);
124
124
  }
125
- exports.useCompression = useCompression;
@@ -20,8 +20,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
20
20
  });
21
21
  };
22
22
  var __generator = (this && this.__generator) || function (thisArg, body) {
23
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
24
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
23
+ 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);
24
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
25
25
  function verb(n) { return function (v) { return step([n, v]); }; }
26
26
  function step(op) {
27
27
  if (f) throw new TypeError("Generator is already executing.");
@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
47
47
  }
48
48
  };
49
49
  Object.defineProperty(exports, "__esModule", { value: true });
50
- exports.useTakePicture = void 0;
50
+ exports.useTakePicture = useTakePicture;
51
51
  var monitoring_1 = require("@monkvision/monitoring");
52
52
  var common_1 = require("@monkvision/common");
53
53
  var react_1 = require("react");
@@ -96,4 +96,3 @@ function useTakePicture(_a) {
96
96
  }); }, [createTransaction, monitoring, takeScreenshot, compress, onPictureTaken]);
97
97
  return (0, common_1.useObjectMemo)({ takePicture: takePicture, isLoading: isLoading });
98
98
  }
99
- exports.useTakePicture = useTakePicture;
@@ -126,4 +126,4 @@ export interface UserMediaResult {
126
126
  * for more information.
127
127
  * @see UserMediaResult
128
128
  */
129
- export declare function useUserMedia(constraints: MediaStreamConstraints, videoRef: RefObject<HTMLVideoElement> | null): UserMediaResult;
129
+ export declare function useUserMedia(constraints: MediaStreamConstraints, videoRef: RefObject<HTMLVideoElement | null> | null): UserMediaResult;
@@ -35,8 +35,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
35
35
  });
36
36
  };
37
37
  var __generator = (this && this.__generator) || function (thisArg, body) {
38
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
39
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
38
+ 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);
39
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
40
40
  function verb(n) { return function (v) { return step([n, v]); }; }
41
41
  function step(op) {
42
42
  if (f) throw new TypeError("Generator is already executing.");
@@ -65,7 +65,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
65
65
  return (mod && mod.__esModule) ? mod : { "default": mod };
66
66
  };
67
67
  Object.defineProperty(exports, "__esModule", { value: true });
68
- exports.useUserMedia = exports.UserMediaErrorType = exports.InvalidStreamErrorName = void 0;
68
+ exports.UserMediaErrorType = exports.InvalidStreamErrorName = void 0;
69
+ exports.useUserMedia = useUserMedia;
69
70
  var monitoring_1 = require("@monkvision/monitoring");
70
71
  var fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
71
72
  var react_1 = require("react");
@@ -84,7 +85,7 @@ var InvalidStreamErrorName;
84
85
  * The stream had too many video tracks (more than one).
85
86
  */
86
87
  InvalidStreamErrorName["TOO_MANY_VIDEO_TRACKS"] = "TooManyVideoTracks";
87
- })(InvalidStreamErrorName = exports.InvalidStreamErrorName || (exports.InvalidStreamErrorName = {}));
88
+ })(InvalidStreamErrorName || (exports.InvalidStreamErrorName = InvalidStreamErrorName = {}));
88
89
  var InvalidStreamError = /** @class */ (function (_super) {
89
90
  __extends(InvalidStreamError, _super);
90
91
  function InvalidStreamError(message, name) {
@@ -137,7 +138,7 @@ var UserMediaErrorType;
137
138
  * Any other error.
138
139
  */
139
140
  UserMediaErrorType["OTHER"] = "other";
140
- })(UserMediaErrorType = exports.UserMediaErrorType || (exports.UserMediaErrorType = {}));
141
+ })(UserMediaErrorType || (exports.UserMediaErrorType = UserMediaErrorType = {}));
141
142
  function getStreamVideoTrackSettings(stream) {
142
143
  var videoTracks = stream.getVideoTracks();
143
144
  if (videoTracks.length === 0) {
@@ -228,10 +229,6 @@ function useUserMedia(constraints, videoRef) {
228
229
  switch (_a.label) {
229
230
  case 0:
230
231
  setIsLoading(true);
231
- if (stream) {
232
- stream.removeEventListener('inactive', onStreamInactive);
233
- stream.getTracks().forEach(function (track) { return track.stop(); });
234
- }
235
232
  return [4 /*yield*/, (0, utils_1.analyzeCameraDevices)(constraints)];
236
233
  case 1:
237
234
  deviceDetails = _a.sent();
@@ -312,8 +309,9 @@ function useUserMedia(constraints, videoRef) {
312
309
  }, [constraints, stream, error, isLoading, lastConstraintsApplied, getUserMedia, videoRef]);
313
310
  (0, react_1.useEffect)(function () {
314
311
  return function () {
315
- var _a;
316
- (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach(function (track) {
312
+ var _a, _b;
313
+ (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('inactive', onStreamInactive);
314
+ (_b = streamRef.current) === null || _b === void 0 ? void 0 : _b.getTracks().forEach(function (track) {
317
315
  track.stop();
318
316
  });
319
317
  };
@@ -328,4 +326,3 @@ function useUserMedia(constraints, videoRef) {
328
326
  selectedCameraDeviceId: selectedCameraDeviceId,
329
327
  });
330
328
  }
331
- exports.useUserMedia = useUserMedia;
@@ -9,8 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
9
9
  });
10
10
  };
11
11
  var __generator = (this && this.__generator) || function (thisArg, body) {
12
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
13
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
12
+ 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);
13
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
14
14
  function verb(n) { return function (v) { return step([n, v]); }; }
15
15
  function step(op) {
16
16
  if (f) throw new TypeError("Generator is already executing.");
@@ -36,7 +36,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
36
36
  }
37
37
  };
38
38
  Object.defineProperty(exports, "__esModule", { value: true });
39
- exports.analyzeCameraDevices = void 0;
39
+ exports.analyzeCameraDevices = analyzeCameraDevices;
40
40
  function isVideoRecordingDevice(device) {
41
41
  return device.kind === 'videoinput';
42
42
  }
@@ -71,4 +71,3 @@ function analyzeCameraDevices(constraints) {
71
71
  });
72
72
  });
73
73
  }
74
- exports.analyzeCameraDevices = analyzeCameraDevices;
@@ -15,4 +15,4 @@ export interface CanvasHandle {
15
15
  /**
16
16
  * Utility function used to retreive a canvas handle or throw if it is not available.
17
17
  */
18
- export declare function getCanvasHandle(ref: RefObject<HTMLCanvasElement>, onError?: (err: Error) => void): CanvasHandle;
18
+ export declare function getCanvasHandle(ref: RefObject<HTMLCanvasElement | null>, onError?: (err: Error) => void): CanvasHandle;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getCanvasHandle = void 0;
3
+ exports.getCanvasHandle = getCanvasHandle;
4
4
  /**
5
5
  * Utility function used to retreive a canvas handle or throw if it is not available.
6
6
  */
@@ -25,4 +25,3 @@ function getCanvasHandle(ref, onError) {
25
25
  }
26
26
  return { canvas: ref.current, context: context };
27
27
  }
28
- exports.getCanvasHandle = getCanvasHandle;
@@ -1,7 +1,9 @@
1
1
  "use strict";
2
2
  var _a;
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.getMediaConstraints = exports.getResolutionDimensions = exports.CameraFacingMode = void 0;
4
+ exports.CameraFacingMode = void 0;
5
+ exports.getResolutionDimensions = getResolutionDimensions;
6
+ exports.getMediaConstraints = getMediaConstraints;
5
7
  var types_1 = require("@monkvision/types");
6
8
  /**
7
9
  * Enumeration of the facing modes for the camera constraints.
@@ -16,7 +18,7 @@ var CameraFacingMode;
16
18
  * Enironment-facing camera (back camera).
17
19
  */
18
20
  CameraFacingMode["ENVIRONMENT"] = "environment";
19
- })(CameraFacingMode = exports.CameraFacingMode || (exports.CameraFacingMode = {}));
21
+ })(CameraFacingMode || (exports.CameraFacingMode = CameraFacingMode = {}));
20
22
  var CAMERA_RESOLUTION_DIMENSIONS = (_a = {},
21
23
  _a[types_1.CameraResolution.QNHD_180P] = { width: 320, height: 180 },
22
24
  _a[types_1.CameraResolution.NHD_360P] = { width: 640, height: 360 },
@@ -36,7 +38,6 @@ function getResolutionDimensions(resolution, isPortrait) {
36
38
  height: isPortrait ? dimensions.width : dimensions.height,
37
39
  };
38
40
  }
39
- exports.getResolutionDimensions = getResolutionDimensions;
40
41
  /**
41
42
  * This function is used by the Monk Camera package in order to add a layer of abstraction to the media constraints
42
43
  * passed to the `useUserMedia` hook. It takes an optional `CameraOptions` parameter and creates a
@@ -58,4 +59,3 @@ function getMediaConstraints(config) {
58
59
  video: video,
59
60
  };
60
61
  }
61
- exports.getMediaConstraints = getMediaConstraints;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { CameraHUDProps } from '../Camera';
3
2
  /**
4
3
  * Props accepted by the SimpleCameraHUD component.
@@ -21,5 +20,5 @@ export declare const SimpleCameraHUD: import("react").ForwardRefExoticComponent<
21
20
  *
22
21
  * @default: en
23
22
  */
24
- lang?: string | null | undefined;
23
+ lang?: string | null;
25
24
  } & import("react").RefAttributes<unknown>>;
@@ -32,5 +32,5 @@ exports.SimpleCameraHUD = (0, common_1.i18nWrap)(function SimpleCameraHUD(_a) {
32
32
  var responsive = (0, common_1.useResponsiveStyle)().responsive;
33
33
  var isHUDDisabled = handle.isLoading || !!handle.error;
34
34
  var errorLabel = (0, utils_1.getCameraErrorLabel)((_b = handle.error) === null || _b === void 0 ? void 0 : _b.type);
35
- 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 })] })));
35
+ 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 })] }));
36
36
  }, i18n_1.i18nCamera);
@@ -9,8 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
9
9
  });
10
10
  };
11
11
  var __generator = (this && this.__generator) || function (thisArg, body) {
12
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
13
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
12
+ 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);
13
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
14
14
  function verb(n) { return function (v) { return step([n, v]); }; }
15
15
  function step(op) {
16
16
  if (f) throw new TypeError("Generator is already executing.");
@@ -36,7 +36,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
36
36
  }
37
37
  };
38
38
  Object.defineProperty(exports, "__esModule", { value: true });
39
- exports.useCameraPermission = void 0;
39
+ exports.useCameraPermission = useCameraPermission;
40
40
  var react_1 = require("react");
41
41
  var common_1 = require("@monkvision/common");
42
42
  var types_1 = require("@monkvision/types");
@@ -69,4 +69,3 @@ function useCameraPermission() {
69
69
  }); }, [getUserMedia]);
70
70
  return (0, common_1.useObjectMemo)({ requestCameraPermission: requestCameraPermission });
71
71
  }
72
- exports.useCameraPermission = useCameraPermission;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getCameraErrorLabel = void 0;
3
+ exports.getCameraErrorLabel = getCameraErrorLabel;
4
4
  var Camera_1 = require("../Camera");
5
5
  /**
6
6
  * Get a translation object (that can be translated using the useObjectTranslation hook) that contains the translations
@@ -58,4 +58,3 @@ function getCameraErrorLabel(error) {
58
58
  };
59
59
  }
60
60
  }
61
- exports.getCameraErrorLabel = getCameraErrorLabel;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@monkvision/camera-web",
3
- "version": "5.2.5",
3
+ "version": "5.3.0",
4
4
  "license": "BSD-3-Clause-Clear",
5
5
  "packageManager": "yarn@3.2.4",
6
6
  "description": "MonkJs camera package for React (web) used to display a camera preview and take pictures",
@@ -28,32 +28,31 @@
28
28
  "lint:fix": "yarn run prettier:fix && yarn run eslint:fix"
29
29
  },
30
30
  "dependencies": {
31
- "@monkvision/common": "5.2.5",
32
- "@monkvision/common-ui-web": "5.2.5",
33
- "@monkvision/monitoring": "5.2.5",
31
+ "@monkvision/common": "5.3.0",
32
+ "@monkvision/common-ui-web": "5.3.0",
33
+ "@monkvision/monitoring": "5.3.0",
34
34
  "fast-deep-equal": "^3.1.3",
35
35
  "i18next": "^23.4.5",
36
36
  "react-i18next": "^13.2.0"
37
37
  },
38
38
  "peerDependencies": {
39
39
  "@auth0/auth0-react": "^2.2.4",
40
- "react": "^17.0.2",
41
- "react-dom": "^17.0.2",
40
+ "react": "^19.2.3",
41
+ "react-dom": "^19.2.3",
42
42
  "react-router-dom": "^6.22.3"
43
43
  },
44
44
  "devDependencies": {
45
- "@monkvision/eslint-config-base": "5.2.5",
46
- "@monkvision/eslint-config-typescript": "5.2.5",
47
- "@monkvision/eslint-config-typescript-react": "5.2.5",
48
- "@monkvision/jest-config": "5.2.5",
49
- "@monkvision/prettier-config": "5.2.5",
50
- "@monkvision/test-utils": "5.2.5",
51
- "@monkvision/typescript-config": "5.2.5",
52
- "@testing-library/react": "^12.1.5",
53
- "@testing-library/react-hooks": "^8.0.1",
45
+ "@monkvision/eslint-config-base": "5.3.0",
46
+ "@monkvision/eslint-config-typescript": "5.3.0",
47
+ "@monkvision/eslint-config-typescript-react": "5.3.0",
48
+ "@monkvision/jest-config": "5.3.0",
49
+ "@monkvision/prettier-config": "5.3.0",
50
+ "@monkvision/test-utils": "5.3.0",
51
+ "@monkvision/typescript-config": "5.3.0",
52
+ "@testing-library/react": "^16.3.0",
54
53
  "@types/fscreen": "^1.0.1",
55
- "@types/jest": "^29.2.2",
56
- "@types/node": "^18.11.9",
54
+ "@types/jest": "^30",
55
+ "@types/node": "^24.5.2",
57
56
  "@typescript-eslint/eslint-plugin": "^5.43.0",
58
57
  "@typescript-eslint/parser": "^5.43.0",
59
58
  "eslint": "^8.29.0",
@@ -69,14 +68,14 @@
69
68
  "eslint-plugin-react": "^7.27.1",
70
69
  "eslint-plugin-react-hooks": "^4.3.0",
71
70
  "eslint-utils": "^3.0.0",
72
- "jest": "^29.3.1",
73
- "jest-environment-jsdom": "^29.6.2",
71
+ "jest": "^30.2",
72
+ "jest-environment-jsdom": "^30.2",
74
73
  "mkdirp": "^1.0.4",
75
74
  "prettier": "^2.7.1",
76
75
  "regexpp": "^3.2.0",
77
76
  "rimraf": "^3.0.2",
78
- "ts-jest": "^29.0.3",
79
- "typescript": "^4.8.4"
77
+ "ts-jest": "^29.4.6",
78
+ "typescript": "^5.9.2"
80
79
  },
81
80
  "prettier": "@monkvision/prettier-config",
82
81
  "publishConfig": {
@@ -90,5 +89,5 @@
90
89
  "url": "https://github.com/monkvision/monkjs/issues"
91
90
  },
92
91
  "homepage": "https://github.com/monkvision/monkjs",
93
- "gitHead": "0e1d8f131227954e588e0cd014ff141de1060343"
92
+ "gitHead": "5e7b906951524069d0074c7142271b0568c53c47"
94
93
  }