this repo has no description
1const isMobileSafari =
2 /iPad|iPhone|iPod/.test(navigator.userAgent) &&
3 /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
4
5function CameraCaptureInput({
6 hidden,
7 disabled = false,
8 supportedMimeTypes,
9 setMediaAttachments,
10}) {
11 // If not Mobile Safari, only apply image/*
12 // Chrome Android doesn't show the camera if image and video combined
13 // It also can't switch between photo and video mode like iOS/Safari
14 const filteredSupportedMimeTypes = isMobileSafari
15 ? supportedMimeTypes
16 : supportedMimeTypes?.filter((mimeType) => !/^image\//i.test(mimeType));
17
18 return (
19 <input
20 type="file"
21 hidden={hidden}
22 accept={filteredSupportedMimeTypes?.join(',')}
23 capture="environment"
24 disabled={disabled}
25 onChange={(e) => {
26 const files = e.target.files;
27 if (!files) return;
28 const mediaFile = Array.from(files)[0];
29 if (!mediaFile) return;
30 setMediaAttachments((attachments) => [
31 ...attachments,
32 {
33 file: mediaFile,
34 type: mediaFile.type,
35 size: mediaFile.size,
36 url: URL.createObjectURL(mediaFile),
37 id: null, // indicate uploaded state
38 description: null,
39 },
40 ]);
41 e.target.value = null;
42 }}
43 />
44 );
45}
46
47export const supportsCameraCapture = (() => {
48 const input = document.createElement('input');
49 return 'capture' in input;
50})();
51
52export default CameraCaptureInput;