@chayns-components/scanner 5.0.0-beta.1265 → 5.0.0-beta.1268
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.
- package/lib/cjs/components/code-scanner/CodeScanner.js +31 -2
- package/lib/cjs/components/code-scanner/CodeScanner.js.map +1 -1
- package/lib/cjs/components/code-scanner/CodeScanner.styles.js +9 -1
- package/lib/cjs/components/code-scanner/CodeScanner.styles.js.map +1 -1
- package/lib/cjs/components/code-scanner/scanner-toolbar/ScannerToolbar.js +4 -0
- package/lib/cjs/components/code-scanner/scanner-toolbar/ScannerToolbar.js.map +1 -1
- package/lib/cjs/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.js +14 -1
- package/lib/cjs/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.js.map +1 -1
- package/lib/esm/components/code-scanner/CodeScanner.js +32 -3
- package/lib/esm/components/code-scanner/CodeScanner.js.map +1 -1
- package/lib/esm/components/code-scanner/CodeScanner.styles.js +8 -0
- package/lib/esm/components/code-scanner/CodeScanner.styles.js.map +1 -1
- package/lib/esm/components/code-scanner/scanner-toolbar/ScannerToolbar.js +5 -1
- package/lib/esm/components/code-scanner/scanner-toolbar/ScannerToolbar.js.map +1 -1
- package/lib/esm/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.js +13 -0
- package/lib/esm/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.js.map +1 -1
- package/lib/types/components/code-scanner/CodeScanner.d.ts +8 -0
- package/lib/types/components/code-scanner/CodeScanner.styles.d.ts +1 -0
- package/lib/types/components/code-scanner/scanner-toolbar/ScannerToolbar.d.ts +4 -0
- package/lib/types/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.d.ts +1 -0
- package/package.json +2 -2
|
@@ -27,7 +27,9 @@ const CodeScanner = ({
|
|
|
27
27
|
isFileSelectDisabled = false,
|
|
28
28
|
isTorchDisabled = false,
|
|
29
29
|
isZoomDisabled = false,
|
|
30
|
+
shouldShowIconOverlay = false,
|
|
30
31
|
scanInterval = 250,
|
|
32
|
+
placeholder,
|
|
31
33
|
errorMessages
|
|
32
34
|
}) => {
|
|
33
35
|
const [isPolyfillLoaded, setIsPolyfillLoaded] = (0, _react.useState)(false);
|
|
@@ -39,6 +41,10 @@ const CodeScanner = ({
|
|
|
39
41
|
const [isHandlingCode, setIsHandlingCode] = (0, _react.useState)(false);
|
|
40
42
|
const lastCode = (0, _react.useRef)();
|
|
41
43
|
const handleStopRef = (0, _react.useRef)();
|
|
44
|
+
const prevValueRef = (0, _react.useRef)({
|
|
45
|
+
value: '',
|
|
46
|
+
timestamp: 0
|
|
47
|
+
});
|
|
42
48
|
const {
|
|
43
49
|
loadQrCodeDetector
|
|
44
50
|
} = (0, _loadscript.useScannerPolyfill)();
|
|
@@ -57,12 +63,30 @@ const CodeScanner = ({
|
|
|
57
63
|
}, [errorMessages, scannerError]);
|
|
58
64
|
const handleScan = (0, _react.useCallback)(code => {
|
|
59
65
|
if (!onScan) return;
|
|
66
|
+
const now = Date.now();
|
|
67
|
+
if (!prevValueRef.current) {
|
|
68
|
+
prevValueRef.current = {
|
|
69
|
+
value: '',
|
|
70
|
+
timestamp: 0
|
|
71
|
+
};
|
|
72
|
+
}
|
|
73
|
+
const {
|
|
74
|
+
value: prevValue,
|
|
75
|
+
timestamp: prevTimestamp
|
|
76
|
+
} = prevValueRef.current;
|
|
77
|
+
if (code.value === prevValue && now - prevTimestamp < scanInterval * 3) {
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
prevValueRef.current = {
|
|
81
|
+
value: code.value,
|
|
82
|
+
timestamp: now
|
|
83
|
+
};
|
|
60
84
|
const result = onScan(code);
|
|
61
85
|
if (result instanceof Promise) {
|
|
62
86
|
setIsHandlingCode(true);
|
|
63
87
|
void result.finally(() => setIsHandlingCode(false));
|
|
64
88
|
}
|
|
65
|
-
}, [onScan]);
|
|
89
|
+
}, [onScan, scanInterval]);
|
|
66
90
|
const handleScanResult = (0, _react.useCallback)(result => {
|
|
67
91
|
if (!result.length) return;
|
|
68
92
|
const code = result[0];
|
|
@@ -201,7 +225,12 @@ const CodeScanner = ({
|
|
|
201
225
|
height: "100%",
|
|
202
226
|
width: "100%",
|
|
203
227
|
$isVisible: !!barcodeDetector && !errorText
|
|
204
|
-
}),
|
|
228
|
+
}), shouldShowIconOverlay && /*#__PURE__*/_react.default.createElement(_CodeScanner.StyledCodeScannerIconOverlay, null, /*#__PURE__*/_react.default.createElement(_core.Icon, {
|
|
229
|
+
icons: ['ts-calling-code'],
|
|
230
|
+
color: "#ffffff",
|
|
231
|
+
size: 125
|
|
232
|
+
})), !!barcodeDetector && /*#__PURE__*/_react.default.createElement(_ScannerToolbar.default, {
|
|
233
|
+
placeholder: placeholder,
|
|
205
234
|
videoConstraints: videoConstraints,
|
|
206
235
|
onFileSelect: data => {
|
|
207
236
|
setIsScanningFile(true);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeScanner.js","names":["_react","_interopRequireWildcard","require","_chaynsApi","_core","_CodeScanner","_codeScanner","_codeScanner2","_support","_errorDialog","_ScannerToolbar","_interopRequireDefault","_loadscript","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CodeScanner","shouldTriggerForSameCode","onScan","allowedFormats","ALL_FORMATS","trackConstraints","DEFAULT_TRACK_CONSTRAINTS","videoConstraints","DEFAULT_VIDEO_CONSTRAINTS","minZoom","maxZoom","isFileSelectDisabled","isTorchDisabled","isZoomDisabled","scanInterval","errorMessages","isPolyfillLoaded","setIsPolyfillLoaded","useState","videoRef","setVideoRef","barcodeDetector","setBarcodeDetector","stream","setStream","scannerError","setScannerError","undefined","isScanningFile","setIsScanningFile","isHandlingCode","setIsHandlingCode","lastCode","useRef","handleStopRef","loadQrCodeDetector","useScannerPolyfill","errorText","useMemo","ScannerErrorType","NO_CAMERA_ACCESS","noPermission","CAMERA_ALREADY_IN_USE","alreadyInUse","cameraNotAvailable","handleScan","useCallback","code","result","Promise","finally","handleScanResult","length","includes","format","value","rawValue","current","handleVideoInitialization","navigator","mediaDevices","getUserMedia","res","video","error","name","DEVICE_NOT_FOUND","UNKNOWN","console","warn","getVideoTracks","forEach","elem","_trackConstraints$adv","constraints","advanced","map","a","checkTrackSupport","push","zoom","applyConstraints","srcObject","play","codeDetector","BarcodeDetector","formats","handleStopCameraAccess","pause","getTracks","track","stop","useEffect","then","idPromise","addVisibilityChangeListener","isVisible","id","removeVisibilityChangeListener","interval","setInterval","detect","clearInterval","enumerateDevices","createElement","StyledCodeScanner","StyledCodeScannerTextWrapper","SmallWaitCursor","Fragment","Icon","icons","size","color","StyledCodeScannerPreview","ref","autoPlay","playsInline","height","width","$isVisible","onFileSelect","data","createErrorAlertDialog","noCodeFound","open","hasScannerError","_default","exports"],"sources":["../../../../src/components/code-scanner/CodeScanner.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { addVisibilityChangeListener, removeVisibilityChangeListener } from 'chayns-api';\nimport { Icon, SmallWaitCursor } from '@chayns-components/core';\nimport {\n StyledCodeScanner,\n StyledCodeScannerPreview,\n StyledCodeScannerTextWrapper,\n} from './CodeScanner.styles';\nimport {\n CodeReaderOnScanCallback,\n ScannerErrorMessages,\n ScannerErrorType,\n} from '../../types/codeScanner';\nimport {\n ALL_FORMATS,\n DEFAULT_TRACK_CONSTRAINTS,\n DEFAULT_VIDEO_CONSTRAINTS,\n} from '../../constants/codeScanner';\nimport { checkTrackSupport } from '../../utils/support';\nimport { createErrorAlertDialog } from '../../utils/errorDialog';\nimport ScannerToolbar from './scanner-toolbar/ScannerToolbar';\nimport { useScannerPolyfill } from '../../hooks/loadscript';\n\ntype CodeScannerProps = {\n /**\n * Defines which barcode formats are allowed to be detected.\n */\n allowedFormats?: Array<BarcodeFormat>;\n /**\n * The interval of the scans.\n */\n scanInterval?: number;\n /**\n * Custom error messages for various scanner states or failures.\n */\n errorMessages: ScannerErrorMessages;\n /**\n * Disables the file select feature if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) feature if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Disables the zoom control if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback function triggered when a code is successfully scanned.\n */\n onScan?: CodeReaderOnScanCallback;\n /**\n * If true, allows scanning the same code multiple times in a row.\n */\n shouldTriggerForSameCode?: boolean;\n /**\n * Custom media track constraints for controlling the video input.\n */\n trackConstraints?: MediaTrackConstraints;\n /**\n * Additional video constraints for the camera feed.\n */\n videoConstraints?: MediaTrackConstraints;\n};\n\nconst CodeScanner: FC<CodeScannerProps> = ({\n shouldTriggerForSameCode = false,\n onScan,\n allowedFormats = ALL_FORMATS,\n trackConstraints = DEFAULT_TRACK_CONSTRAINTS,\n videoConstraints = DEFAULT_VIDEO_CONSTRAINTS,\n minZoom = 2,\n maxZoom = 10,\n isFileSelectDisabled = false,\n isTorchDisabled = false,\n isZoomDisabled = false,\n scanInterval = 250,\n errorMessages,\n}) => {\n const [isPolyfillLoaded, setIsPolyfillLoaded] = useState(false);\n const [videoRef, setVideoRef] = useState<HTMLVideoElement | null>(null);\n const [barcodeDetector, setBarcodeDetector] = useState<BarcodeDetector>();\n const [stream, setStream] = useState<MediaStream>();\n const [scannerError, setScannerError] = useState<ScannerErrorType | undefined>(undefined);\n const [isScanningFile, setIsScanningFile] = useState(false);\n const [isHandlingCode, setIsHandlingCode] = useState(false);\n const lastCode = useRef<string>();\n const handleStopRef = useRef<() => void>();\n\n const { loadQrCodeDetector } = useScannerPolyfill();\n\n const errorText = useMemo(() => {\n if (typeof scannerError === 'undefined') {\n return undefined;\n }\n\n switch (scannerError) {\n case ScannerErrorType.NO_CAMERA_ACCESS:\n return errorMessages.noPermission;\n case ScannerErrorType.CAMERA_ALREADY_IN_USE:\n return errorMessages.alreadyInUse;\n default:\n return errorMessages.cameraNotAvailable;\n }\n }, [errorMessages, scannerError]);\n\n const handleScan = useCallback(\n (code: { format: BarcodeFormat; value: string }) => {\n if (!onScan) return;\n const result = onScan(code);\n if (result instanceof Promise) {\n setIsHandlingCode(true);\n void result.finally(() => setIsHandlingCode(false));\n }\n },\n [onScan],\n );\n\n const handleScanResult = useCallback(\n (result: Array<DetectedBarcode>) => {\n if (!result.length) return;\n\n const code = result[0];\n\n if (!code) {\n return;\n }\n\n if (allowedFormats && !allowedFormats.includes(code.format)) {\n return;\n }\n\n if (shouldTriggerForSameCode) {\n handleScan({ format: code.format, value: code.rawValue });\n return;\n }\n\n if (lastCode.current && code.rawValue === lastCode.current) {\n return;\n }\n\n lastCode.current = code.rawValue;\n handleScan({ format: code.format, value: code.rawValue });\n },\n [handleScan, shouldTriggerForSameCode, allowedFormats],\n );\n\n const handleVideoInitialization = useCallback(async () => {\n if (!navigator.mediaDevices.getUserMedia || !videoRef || !isPolyfillLoaded) return;\n\n let res: MediaStream | undefined;\n\n try {\n res = await navigator.mediaDevices.getUserMedia({\n video: videoConstraints,\n });\n } catch (e) {\n const error = e as Error;\n\n if (error.name === 'NotAllowedError') {\n setScannerError(ScannerErrorType.NO_CAMERA_ACCESS);\n } else if (error.name === 'NotReadableError') {\n setScannerError(ScannerErrorType.CAMERA_ALREADY_IN_USE);\n } else if (error.name === 'NotFoundError') {\n setScannerError(ScannerErrorType.DEVICE_NOT_FOUND);\n } else {\n setScannerError(ScannerErrorType.UNKNOWN);\n console.warn(e);\n }\n }\n\n if (res) {\n res.getVideoTracks().forEach((elem) => {\n const constraints = {\n ...trackConstraints,\n advanced: trackConstraints.advanced?.map((a) => ({ ...a })) || [],\n };\n\n if (checkTrackSupport(elem, 'zoom')) {\n constraints.advanced.push({ zoom: minZoom });\n }\n\n void elem.applyConstraints(constraints);\n });\n\n setStream(res);\n\n videoRef.srcObject = res;\n\n await videoRef.play();\n }\n\n const codeDetector = new BarcodeDetector(\n allowedFormats ? { formats: allowedFormats } : undefined,\n );\n\n setBarcodeDetector(codeDetector);\n }, [isPolyfillLoaded, minZoom, trackConstraints, allowedFormats, videoConstraints, videoRef]);\n\n const handleStopCameraAccess = useCallback(() => {\n if (videoRef) {\n videoRef.pause();\n }\n\n if (barcodeDetector) {\n setBarcodeDetector(undefined);\n }\n\n if (stream) {\n stream.getTracks().forEach((track) => track.stop());\n setStream(undefined);\n }\n }, [barcodeDetector, stream, videoRef]);\n\n // Load BarCodeDetector\n useEffect(() => {\n void loadQrCodeDetector().then(() => {\n setIsPolyfillLoaded(true);\n });\n\n return () => {\n if (handleStopRef.current) handleStopRef.current();\n };\n }, [loadQrCodeDetector]);\n\n useEffect(() => {\n handleStopRef.current = handleStopCameraAccess;\n }, [handleStopCameraAccess]);\n\n useEffect(() => {\n const idPromise = addVisibilityChangeListener(({ isVisible }) => {\n if (!isVisible) {\n handleStopCameraAccess();\n } else {\n void handleVideoInitialization();\n }\n });\n\n return () => {\n void idPromise.then((id) => {\n void removeVisibilityChangeListener(id);\n });\n };\n }, [handleStopCameraAccess, handleVideoInitialization]);\n\n useEffect(() => {\n if (!barcodeDetector || !videoRef) return undefined;\n\n if (!isScanningFile && !isHandlingCode) {\n const interval = setInterval(() => {\n void barcodeDetector.detect(videoRef).then(handleScanResult);\n }, scanInterval);\n\n return () => clearInterval(interval);\n }\n\n return undefined;\n }, [barcodeDetector, handleScanResult, isHandlingCode, isScanningFile, videoRef, scanInterval]);\n\n useEffect(() => {\n if (\n !navigator.mediaDevices.enumerateDevices ||\n !navigator.mediaDevices.getUserMedia ||\n !videoRef ||\n !isPolyfillLoaded\n ) {\n return;\n }\n\n void handleVideoInitialization();\n }, [handleVideoInitialization, isPolyfillLoaded, videoRef]);\n\n return (\n <StyledCodeScanner>\n {(!barcodeDetector || errorText) && (\n <StyledCodeScannerTextWrapper>\n {!barcodeDetector && !errorText && <SmallWaitCursor />}\n {errorText && (\n <>\n <Icon\n icons={['fa fa-webcam-slash']}\n size={40}\n color=\"rgb(128, 128, 128)\"\n />\n {errorText}\n </>\n )}\n </StyledCodeScannerTextWrapper>\n )}\n <StyledCodeScannerPreview\n ref={setVideoRef}\n autoPlay\n playsInline\n height=\"100%\"\n width=\"100%\"\n $isVisible={!!barcodeDetector && !errorText}\n />\n {!!barcodeDetector && (\n <ScannerToolbar\n videoConstraints={videoConstraints}\n onFileSelect={(data) => {\n setIsScanningFile(true);\n\n void barcodeDetector\n .detect(data)\n .then((value) => {\n if (value.length) {\n handleScanResult(value);\n } else {\n void createErrorAlertDialog(errorMessages.noCodeFound).open();\n }\n })\n .finally(() => setIsScanningFile(false));\n }}\n isScanningFile={isScanningFile}\n hasScannerError={typeof scannerError !== 'undefined'}\n stream={stream}\n minZoom={minZoom}\n maxZoom={maxZoom}\n isZoomDisabled={isZoomDisabled}\n isTorchDisabled={isTorchDisabled}\n isFileSelectDisabled={isFileSelectDisabled}\n />\n )}\n </StyledCodeScanner>\n );\n};\n\nexport default CodeScanner;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"CodeScanner.js","names":["_react","_interopRequireWildcard","require","_chaynsApi","_core","_CodeScanner","_codeScanner","_codeScanner2","_support","_errorDialog","_ScannerToolbar","_interopRequireDefault","_loadscript","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CodeScanner","shouldTriggerForSameCode","onScan","allowedFormats","ALL_FORMATS","trackConstraints","DEFAULT_TRACK_CONSTRAINTS","videoConstraints","DEFAULT_VIDEO_CONSTRAINTS","minZoom","maxZoom","isFileSelectDisabled","isTorchDisabled","isZoomDisabled","shouldShowIconOverlay","scanInterval","placeholder","errorMessages","isPolyfillLoaded","setIsPolyfillLoaded","useState","videoRef","setVideoRef","barcodeDetector","setBarcodeDetector","stream","setStream","scannerError","setScannerError","undefined","isScanningFile","setIsScanningFile","isHandlingCode","setIsHandlingCode","lastCode","useRef","handleStopRef","prevValueRef","value","timestamp","loadQrCodeDetector","useScannerPolyfill","errorText","useMemo","ScannerErrorType","NO_CAMERA_ACCESS","noPermission","CAMERA_ALREADY_IN_USE","alreadyInUse","cameraNotAvailable","handleScan","useCallback","code","now","Date","current","prevValue","prevTimestamp","result","Promise","finally","handleScanResult","length","includes","format","rawValue","handleVideoInitialization","navigator","mediaDevices","getUserMedia","res","video","error","name","DEVICE_NOT_FOUND","UNKNOWN","console","warn","getVideoTracks","forEach","elem","_trackConstraints$adv","constraints","advanced","map","a","checkTrackSupport","push","zoom","applyConstraints","srcObject","play","codeDetector","BarcodeDetector","formats","handleStopCameraAccess","pause","getTracks","track","stop","useEffect","then","idPromise","addVisibilityChangeListener","isVisible","id","removeVisibilityChangeListener","interval","setInterval","detect","clearInterval","enumerateDevices","createElement","StyledCodeScanner","StyledCodeScannerTextWrapper","SmallWaitCursor","Fragment","Icon","icons","size","color","StyledCodeScannerPreview","ref","autoPlay","playsInline","height","width","$isVisible","StyledCodeScannerIconOverlay","onFileSelect","data","createErrorAlertDialog","noCodeFound","open","hasScannerError","_default","exports"],"sources":["../../../../src/components/code-scanner/CodeScanner.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { addVisibilityChangeListener, removeVisibilityChangeListener } from 'chayns-api';\nimport { Icon, SmallWaitCursor } from '@chayns-components/core';\nimport {\n StyledCodeScanner,\n StyledCodeScannerIconOverlay,\n StyledCodeScannerPreview,\n StyledCodeScannerTextWrapper,\n} from './CodeScanner.styles';\nimport {\n CodeReaderOnScanCallback,\n ScannerErrorMessages,\n ScannerErrorType,\n} from '../../types/codeScanner';\nimport {\n ALL_FORMATS,\n DEFAULT_TRACK_CONSTRAINTS,\n DEFAULT_VIDEO_CONSTRAINTS,\n} from '../../constants/codeScanner';\nimport { checkTrackSupport } from '../../utils/support';\nimport { createErrorAlertDialog } from '../../utils/errorDialog';\nimport ScannerToolbar from './scanner-toolbar/ScannerToolbar';\nimport { useScannerPolyfill } from '../../hooks/loadscript';\n\ntype CodeScannerProps = {\n /**\n * Defines which barcode formats are allowed to be detected.\n */\n allowedFormats?: Array<BarcodeFormat>;\n /**\n * The interval of the scans.\n */\n scanInterval?: number;\n /**\n * Custom error messages for various scanner states or failures.\n */\n errorMessages: ScannerErrorMessages;\n /**\n * Disables the file select feature if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) feature if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Disables the zoom control if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * A placeholder that should be displayed inside the preview.\n */\n placeholder?: string;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback function triggered when a code is successfully scanned.\n */\n onScan?: CodeReaderOnScanCallback;\n /**\n * Whether a calling code icon should be displayed as an overlay.\n */\n shouldShowIconOverlay?: boolean;\n /**\n * If true, allows scanning the same code multiple times in a row.\n */\n shouldTriggerForSameCode?: boolean;\n /**\n * Custom media track constraints for controlling the video input.\n */\n trackConstraints?: MediaTrackConstraints;\n /**\n * Additional video constraints for the camera feed.\n */\n videoConstraints?: MediaTrackConstraints;\n};\n\nconst CodeScanner: FC<CodeScannerProps> = ({\n shouldTriggerForSameCode = false,\n onScan,\n allowedFormats = ALL_FORMATS,\n trackConstraints = DEFAULT_TRACK_CONSTRAINTS,\n videoConstraints = DEFAULT_VIDEO_CONSTRAINTS,\n minZoom = 2,\n maxZoom = 10,\n isFileSelectDisabled = false,\n isTorchDisabled = false,\n isZoomDisabled = false,\n shouldShowIconOverlay = false,\n scanInterval = 250,\n placeholder,\n errorMessages,\n}) => {\n const [isPolyfillLoaded, setIsPolyfillLoaded] = useState(false);\n const [videoRef, setVideoRef] = useState<HTMLVideoElement | null>(null);\n const [barcodeDetector, setBarcodeDetector] = useState<BarcodeDetector>();\n const [stream, setStream] = useState<MediaStream>();\n const [scannerError, setScannerError] = useState<ScannerErrorType | undefined>(undefined);\n const [isScanningFile, setIsScanningFile] = useState(false);\n const [isHandlingCode, setIsHandlingCode] = useState(false);\n const lastCode = useRef<string>();\n const handleStopRef = useRef<() => void>();\n const prevValueRef = useRef<{ value: string; timestamp: number }>({\n value: '',\n timestamp: 0,\n });\n\n const { loadQrCodeDetector } = useScannerPolyfill();\n\n const errorText = useMemo(() => {\n if (typeof scannerError === 'undefined') {\n return undefined;\n }\n\n switch (scannerError) {\n case ScannerErrorType.NO_CAMERA_ACCESS:\n return errorMessages.noPermission;\n case ScannerErrorType.CAMERA_ALREADY_IN_USE:\n return errorMessages.alreadyInUse;\n default:\n return errorMessages.cameraNotAvailable;\n }\n }, [errorMessages, scannerError]);\n\n const handleScan = useCallback(\n (code: { format: BarcodeFormat; value: string }) => {\n if (!onScan) return;\n\n const now = Date.now();\n\n if (!prevValueRef.current) {\n prevValueRef.current = { value: '', timestamp: 0 };\n }\n\n const { value: prevValue, timestamp: prevTimestamp } = prevValueRef.current;\n\n if (code.value === prevValue && now - prevTimestamp < scanInterval * 3) {\n return;\n }\n\n prevValueRef.current = { value: code.value, timestamp: now };\n\n const result = onScan(code);\n if (result instanceof Promise) {\n setIsHandlingCode(true);\n void result.finally(() => setIsHandlingCode(false));\n }\n },\n [onScan, scanInterval],\n );\n\n const handleScanResult = useCallback(\n (result: Array<DetectedBarcode>) => {\n if (!result.length) return;\n\n const code = result[0];\n\n if (!code) {\n return;\n }\n\n if (allowedFormats && !allowedFormats.includes(code.format)) {\n return;\n }\n\n if (shouldTriggerForSameCode) {\n handleScan({ format: code.format, value: code.rawValue });\n return;\n }\n\n if (lastCode.current && code.rawValue === lastCode.current) {\n return;\n }\n\n lastCode.current = code.rawValue;\n handleScan({ format: code.format, value: code.rawValue });\n },\n [handleScan, shouldTriggerForSameCode, allowedFormats],\n );\n\n const handleVideoInitialization = useCallback(async () => {\n if (!navigator.mediaDevices.getUserMedia || !videoRef || !isPolyfillLoaded) return;\n\n let res: MediaStream | undefined;\n\n try {\n res = await navigator.mediaDevices.getUserMedia({\n video: videoConstraints,\n });\n } catch (e) {\n const error = e as Error;\n\n if (error.name === 'NotAllowedError') {\n setScannerError(ScannerErrorType.NO_CAMERA_ACCESS);\n } else if (error.name === 'NotReadableError') {\n setScannerError(ScannerErrorType.CAMERA_ALREADY_IN_USE);\n } else if (error.name === 'NotFoundError') {\n setScannerError(ScannerErrorType.DEVICE_NOT_FOUND);\n } else {\n setScannerError(ScannerErrorType.UNKNOWN);\n console.warn(e);\n }\n }\n\n if (res) {\n res.getVideoTracks().forEach((elem) => {\n const constraints = {\n ...trackConstraints,\n advanced: trackConstraints.advanced?.map((a) => ({ ...a })) || [],\n };\n\n if (checkTrackSupport(elem, 'zoom')) {\n constraints.advanced.push({ zoom: minZoom });\n }\n\n void elem.applyConstraints(constraints);\n });\n\n setStream(res);\n\n videoRef.srcObject = res;\n\n await videoRef.play();\n }\n\n const codeDetector = new BarcodeDetector(\n allowedFormats ? { formats: allowedFormats } : undefined,\n );\n\n setBarcodeDetector(codeDetector);\n }, [isPolyfillLoaded, minZoom, trackConstraints, allowedFormats, videoConstraints, videoRef]);\n\n const handleStopCameraAccess = useCallback(() => {\n if (videoRef) {\n videoRef.pause();\n }\n\n if (barcodeDetector) {\n setBarcodeDetector(undefined);\n }\n\n if (stream) {\n stream.getTracks().forEach((track) => track.stop());\n setStream(undefined);\n }\n }, [barcodeDetector, stream, videoRef]);\n\n // Load BarCodeDetector\n useEffect(() => {\n void loadQrCodeDetector().then(() => {\n setIsPolyfillLoaded(true);\n });\n\n return () => {\n if (handleStopRef.current) handleStopRef.current();\n };\n }, [loadQrCodeDetector]);\n\n useEffect(() => {\n handleStopRef.current = handleStopCameraAccess;\n }, [handleStopCameraAccess]);\n\n useEffect(() => {\n const idPromise = addVisibilityChangeListener(({ isVisible }) => {\n if (!isVisible) {\n handleStopCameraAccess();\n } else {\n void handleVideoInitialization();\n }\n });\n\n return () => {\n void idPromise.then((id) => {\n void removeVisibilityChangeListener(id);\n });\n };\n }, [handleStopCameraAccess, handleVideoInitialization]);\n\n useEffect(() => {\n if (!barcodeDetector || !videoRef) return undefined;\n\n if (!isScanningFile && !isHandlingCode) {\n const interval = setInterval(() => {\n void barcodeDetector.detect(videoRef).then(handleScanResult);\n }, scanInterval);\n\n return () => clearInterval(interval);\n }\n\n return undefined;\n }, [barcodeDetector, handleScanResult, isHandlingCode, isScanningFile, videoRef, scanInterval]);\n\n useEffect(() => {\n if (\n !navigator.mediaDevices.enumerateDevices ||\n !navigator.mediaDevices.getUserMedia ||\n !videoRef ||\n !isPolyfillLoaded\n ) {\n return;\n }\n\n void handleVideoInitialization();\n }, [handleVideoInitialization, isPolyfillLoaded, videoRef]);\n\n return (\n <StyledCodeScanner>\n {(!barcodeDetector || errorText) && (\n <StyledCodeScannerTextWrapper>\n {!barcodeDetector && !errorText && <SmallWaitCursor />}\n {errorText && (\n <>\n <Icon\n icons={['fa fa-webcam-slash']}\n size={40}\n color=\"rgb(128, 128, 128)\"\n />\n {errorText}\n </>\n )}\n </StyledCodeScannerTextWrapper>\n )}\n <StyledCodeScannerPreview\n ref={setVideoRef}\n autoPlay\n playsInline\n height=\"100%\"\n width=\"100%\"\n $isVisible={!!barcodeDetector && !errorText}\n />\n {shouldShowIconOverlay && (\n <StyledCodeScannerIconOverlay>\n <Icon icons={['ts-calling-code']} color=\"#ffffff\" size={125} />\n </StyledCodeScannerIconOverlay>\n )}\n {!!barcodeDetector && (\n <ScannerToolbar\n placeholder={placeholder}\n videoConstraints={videoConstraints}\n onFileSelect={(data) => {\n setIsScanningFile(true);\n\n void barcodeDetector\n .detect(data)\n .then((value) => {\n if (value.length) {\n handleScanResult(value);\n } else {\n void createErrorAlertDialog(errorMessages.noCodeFound).open();\n }\n })\n .finally(() => setIsScanningFile(false));\n }}\n isScanningFile={isScanningFile}\n hasScannerError={typeof scannerError !== 'undefined'}\n stream={stream}\n minZoom={minZoom}\n maxZoom={maxZoom}\n isZoomDisabled={isZoomDisabled}\n isTorchDisabled={isTorchDisabled}\n isFileSelectDisabled={isFileSelectDisabled}\n />\n )}\n </StyledCodeScanner>\n );\n};\n\nexport default CodeScanner;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,13 +3,14 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.StyledCodeScannerTextWrapper = exports.StyledCodeScannerPreview = exports.StyledCodeScanner = void 0;
|
|
6
|
+
exports.StyledCodeScannerTextWrapper = exports.StyledCodeScannerPreview = exports.StyledCodeScannerIconOverlay = exports.StyledCodeScanner = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
8
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
9
|
const StyledCodeScanner = exports.StyledCodeScanner = _styledComponents.default.div`
|
|
10
10
|
display: flex;
|
|
11
11
|
justify-content: center;
|
|
12
12
|
align-items: center;
|
|
13
|
+
position: relative;
|
|
13
14
|
`;
|
|
14
15
|
const StyledCodeScannerTextWrapper = exports.StyledCodeScannerTextWrapper = _styledComponents.default.div`
|
|
15
16
|
width: 640px;
|
|
@@ -31,4 +32,11 @@ const StyledCodeScannerPreview = exports.StyledCodeScannerPreview = _styledCompo
|
|
|
31
32
|
display: none;
|
|
32
33
|
`}
|
|
33
34
|
`;
|
|
35
|
+
const StyledCodeScannerIconOverlay = exports.StyledCodeScannerIconOverlay = _styledComponents.default.div`
|
|
36
|
+
opacity: 0.7;
|
|
37
|
+
position: absolute;
|
|
38
|
+
top: 50%;
|
|
39
|
+
left: 50%;
|
|
40
|
+
transform: translate(-50%, -50%);
|
|
41
|
+
`;
|
|
34
42
|
//# sourceMappingURL=CodeScanner.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeScanner.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledCodeScanner","exports","styled","div","StyledCodeScannerTextWrapper","StyledCodeScannerPreview","video","$isVisible"],"sources":["../../../../src/components/code-scanner/CodeScanner.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledCodeScanner = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\ntype StyledCodeScannerPreviewProps = {\n $isVisible: boolean;\n};\n\nexport const StyledCodeScannerTextWrapper = styled.div`\n width: 640px;\n display: flex;\n justify-content: center;\n align-items: center;\n aspect-ratio: 3 / 2;\n flex-direction: column;\n text-align: center;\n padding: 20px;\n`;\n\nexport const StyledCodeScannerPreview = styled.video<StyledCodeScannerPreviewProps>`\n width: 100%;\n height: 100%;\n\n ${({ $isVisible }) =>\n !$isVisible &&\n `\n display: none;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC3C;AACA;AACA;AACA,CAAC;AAMM,MAAMC,4BAA4B,GAAAH,OAAA,CAAAG,4BAAA,GAAGF,yBAAM,CAACC,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAME,wBAAwB,GAAAJ,OAAA,CAAAI,wBAAA,GAAGH,yBAAM,CAACI,KAAoC;AACnF;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,CAACA,UAAU,IACX;AACR;AACA,KAAK;AACL,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"CodeScanner.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledCodeScanner","exports","styled","div","StyledCodeScannerTextWrapper","StyledCodeScannerPreview","video","$isVisible","StyledCodeScannerIconOverlay"],"sources":["../../../../src/components/code-scanner/CodeScanner.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledCodeScanner = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n`;\n\ntype StyledCodeScannerPreviewProps = {\n $isVisible: boolean;\n};\n\nexport const StyledCodeScannerTextWrapper = styled.div`\n width: 640px;\n display: flex;\n justify-content: center;\n align-items: center;\n aspect-ratio: 3 / 2;\n flex-direction: column;\n text-align: center;\n padding: 20px;\n`;\n\nexport const StyledCodeScannerPreview = styled.video<StyledCodeScannerPreviewProps>`\n width: 100%;\n height: 100%;\n\n ${({ $isVisible }) =>\n !$isVisible &&\n `\n display: none;\n `}\n`;\n\nexport const StyledCodeScannerIconOverlay = styled.div`\n opacity: 0.7;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC3C;AACA;AACA;AACA;AACA,CAAC;AAMM,MAAMC,4BAA4B,GAAAH,OAAA,CAAAG,4BAAA,GAAGF,yBAAM,CAACC,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAME,wBAAwB,GAAAJ,OAAA,CAAAI,wBAAA,GAAGH,yBAAM,CAACI,KAAoC;AACnF;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,CAACA,UAAU,IACX;AACR;AACA,KAAK;AACL,CAAC;AAEM,MAAMC,4BAA4B,GAAAP,OAAA,CAAAO,4BAAA,GAAGN,yBAAM,CAACC,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -21,6 +21,7 @@ const ScannerToolbar = ({
|
|
|
21
21
|
minZoom: minZoomProp = 1,
|
|
22
22
|
maxZoom: maxZoomProp = 3,
|
|
23
23
|
isZoomDisabled = false,
|
|
24
|
+
placeholder,
|
|
24
25
|
isTorchDisabled = false,
|
|
25
26
|
isFileSelectDisabled = false
|
|
26
27
|
}) => {
|
|
@@ -106,6 +107,9 @@ const ScannerToolbar = ({
|
|
|
106
107
|
});
|
|
107
108
|
}
|
|
108
109
|
}, [isTorchActive, isTorchSupported, tracks]);
|
|
110
|
+
if (typeof placeholder === 'string' && placeholder.length > 0) {
|
|
111
|
+
return /*#__PURE__*/_react.default.createElement(_ScannerToolbar.StyledScannerToolbar, null, /*#__PURE__*/_react.default.createElement(_ScannerToolbar.StyledScannerToolbarPlaceholder, null, placeholder));
|
|
112
|
+
}
|
|
109
113
|
return /*#__PURE__*/_react.default.createElement(_ScannerToolbar.StyledScannerToolbar, null, /*#__PURE__*/_react.default.createElement(_ScannerToolbar.StyledScannerToolbarButton, {
|
|
110
114
|
$isAvailable: isTorchSupported,
|
|
111
115
|
$isActive: isTorchActive,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScannerToolbar.js","names":["_react","_interopRequireWildcard","require","_core","_ScannerToolbar","_support","_animate","_codeScanner","_interopRequireDefault","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ScannerToolbar","videoConstraints","onFileSelect","isScanningFile","hasScannerError","stream","minZoom","minZoomProp","maxZoom","maxZoomProp","isZoomDisabled","isTorchDisabled","isFileSelectDisabled","tracks","setTrack","useState","isZoomed","setIsZoomed","previousIsZoomed","usePrevious","isZoomSupported","setIsZoomSupported","isTorchActive","setIsTorchActive","isTorchSupported","setIsTorchSupported","isImageSelectActive","setIsImageSelectActive","useRef","useEffect","undefined","videoTracks","getVideoTracks","canZoom","canTorch","forEach","track","checkTrackSupport","capabilities","getCapabilities","zoom","min","current","max","length","applyConstraints","advanced","animateNumericValue","value","torch","createElement","StyledScannerToolbar","StyledScannerToolbarButton","$isAvailable","$isActive","onClick","prev","Icon","icons","size","selectFiles","multiple","type","then","files","catch","console","error","finally","_default","exports"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { Icon, selectFiles } from '@chayns-components/core';\nimport { StyledScannerToolbar, StyledScannerToolbarButton } from './ScannerToolbar.styles';\nimport { checkTrackSupport } from '../../../utils/support';\nimport { animateNumericValue } from '../../../utils/animate';\nimport usePrevious from '../../../hooks/codeScanner';\n\ntype ScannerToolbarProps = {\n /**\n * Indicates whether the scanner currently has an active error.\n */\n hasScannerError?: boolean;\n /**\n * Disables the file select option if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) button if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Indicates if a file is currently being scanned.\n */\n isScanningFile: boolean;\n /**\n * Disables the zoom slider if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback triggered when a file is selected for scanning.\n */\n onFileSelect: (file: File) => void;\n /**\n * The active media stream used by the scanner.\n */\n stream?: MediaStream;\n /**\n * Defines constraints for the video element, e.g., resolution or facing mode.\n */\n videoConstraints: MediaTrackConstraints;\n};\n\nconst ScannerToolbar: FC<ScannerToolbarProps> = ({\n videoConstraints,\n onFileSelect,\n isScanningFile,\n hasScannerError = false,\n stream,\n minZoom: minZoomProp = 1,\n maxZoom: maxZoomProp = 3,\n isZoomDisabled = false,\n isTorchDisabled = false,\n isFileSelectDisabled = false,\n}) => {\n const [tracks, setTrack] = useState<MediaStreamTrack[]>();\n const [isZoomed, setIsZoomed] = useState<boolean>();\n const previousIsZoomed = usePrevious(isZoomed);\n const [isZoomSupported, setIsZoomSupported] = useState(false);\n const [isTorchActive, setIsTorchActive] = useState(false);\n const [isTorchSupported, setIsTorchSupported] = useState(false);\n const [isImageSelectActive, setIsImageSelectActive] = useState(false);\n\n const minZoom = useRef(minZoomProp);\n const maxZoom = useRef(maxZoomProp);\n\n useEffect(() => {\n if (hasScannerError) {\n setIsTorchSupported(false);\n setIsZoomSupported(false);\n setIsZoomed(false);\n setTrack(undefined);\n } else if (stream) {\n const videoTracks = stream.getVideoTracks();\n\n let canZoom = false;\n let canTorch = false;\n\n videoTracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n canZoom = true;\n\n const capabilities = track.getCapabilities();\n\n if (capabilities.zoom.min > minZoomProp) {\n minZoom.current = capabilities.zoom.min;\n }\n if (capabilities.zoom.max < maxZoomProp) {\n maxZoom.current = capabilities.zoom.max;\n }\n }\n if (checkTrackSupport(track, 'torch')) {\n canTorch = true;\n }\n });\n\n if (canZoom && !isZoomDisabled) {\n setIsZoomSupported(true);\n setIsZoomed(false);\n }\n\n setIsTorchSupported(canTorch && !isTorchDisabled);\n setTrack(videoTracks);\n }\n }, [\n videoConstraints,\n hasScannerError,\n stream,\n minZoomProp,\n maxZoomProp,\n isZoomDisabled,\n isTorchDisabled,\n ]);\n\n useEffect(() => {\n if (tracks?.length && isZoomSupported) {\n if (typeof previousIsZoomed === 'undefined') {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: isZoomed ? maxZoom.current : minZoom.current }],\n });\n }\n });\n } else if (previousIsZoomed !== isZoomed) {\n animateNumericValue(\n previousIsZoomed ? maxZoom.current : minZoom.current,\n isZoomed ? maxZoom.current : minZoom.current,\n 500,\n (value) => {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: value }],\n });\n }\n });\n },\n );\n }\n }\n }, [isZoomSupported, isZoomed, previousIsZoomed, tracks]);\n\n useEffect(() => {\n if (tracks?.length && isTorchSupported) {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'torch')) {\n void track.applyConstraints({\n advanced: [{ torch: isTorchActive }],\n });\n }\n });\n }\n }, [isTorchActive, isTorchSupported, tracks]);\n\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarButton\n $isAvailable={isTorchSupported}\n $isActive={isTorchActive}\n onClick={() => {\n setIsTorchActive((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-lightbulb']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={isZoomSupported}\n $isActive={isZoomed}\n onClick={() => {\n setIsZoomed((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-search-plus']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={!isFileSelectDisabled}\n $isActive={isImageSelectActive || isScanningFile}\n onClick={() => {\n setIsImageSelectActive(true);\n selectFiles({\n multiple: false,\n type: 'image/*',\n })\n .then((files) => {\n if (files && files[0]) {\n onFileSelect(files[0]);\n }\n })\n .catch(console.error)\n .finally(() => {\n setIsImageSelectActive(false);\n });\n }}\n >\n <Icon icons={['far fa-folder-image']} size={25} />\n </StyledScannerToolbarButton>\n </StyledScannerToolbar>\n );\n};\n\nexport default ScannerToolbar;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ScannerToolbar.js","names":["_react","_interopRequireWildcard","require","_core","_ScannerToolbar","_support","_animate","_codeScanner","_interopRequireDefault","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ScannerToolbar","videoConstraints","onFileSelect","isScanningFile","hasScannerError","stream","minZoom","minZoomProp","maxZoom","maxZoomProp","isZoomDisabled","placeholder","isTorchDisabled","isFileSelectDisabled","tracks","setTrack","useState","isZoomed","setIsZoomed","previousIsZoomed","usePrevious","isZoomSupported","setIsZoomSupported","isTorchActive","setIsTorchActive","isTorchSupported","setIsTorchSupported","isImageSelectActive","setIsImageSelectActive","useRef","useEffect","undefined","videoTracks","getVideoTracks","canZoom","canTorch","forEach","track","checkTrackSupport","capabilities","getCapabilities","zoom","min","current","max","length","applyConstraints","advanced","animateNumericValue","value","torch","createElement","StyledScannerToolbar","StyledScannerToolbarPlaceholder","StyledScannerToolbarButton","$isAvailable","$isActive","onClick","prev","Icon","icons","size","selectFiles","multiple","type","then","files","catch","console","error","finally","_default","exports"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { Icon, selectFiles } from '@chayns-components/core';\nimport {\n StyledScannerToolbar,\n StyledScannerToolbarButton,\n StyledScannerToolbarPlaceholder,\n} from './ScannerToolbar.styles';\nimport { checkTrackSupport } from '../../../utils/support';\nimport { animateNumericValue } from '../../../utils/animate';\nimport usePrevious from '../../../hooks/codeScanner';\n\ntype ScannerToolbarProps = {\n /**\n * Indicates whether the scanner currently has an active error.\n */\n hasScannerError?: boolean;\n /**\n * Disables the file select option if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) button if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Indicates if a file is currently being scanned.\n */\n isScanningFile: boolean;\n /**\n * Disables the zoom slider if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * A placeholder that should be displayed inside the preview.\n */\n placeholder?: string;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback triggered when a file is selected for scanning.\n */\n onFileSelect: (file: File) => void;\n /**\n * The active media stream used by the scanner.\n */\n stream?: MediaStream;\n /**\n * Defines constraints for the video element, e.g., resolution or facing mode.\n */\n videoConstraints: MediaTrackConstraints;\n};\n\nconst ScannerToolbar: FC<ScannerToolbarProps> = ({\n videoConstraints,\n onFileSelect,\n isScanningFile,\n hasScannerError = false,\n stream,\n minZoom: minZoomProp = 1,\n maxZoom: maxZoomProp = 3,\n isZoomDisabled = false,\n placeholder,\n isTorchDisabled = false,\n isFileSelectDisabled = false,\n}) => {\n const [tracks, setTrack] = useState<MediaStreamTrack[]>();\n const [isZoomed, setIsZoomed] = useState<boolean>();\n const previousIsZoomed = usePrevious(isZoomed);\n const [isZoomSupported, setIsZoomSupported] = useState(false);\n const [isTorchActive, setIsTorchActive] = useState(false);\n const [isTorchSupported, setIsTorchSupported] = useState(false);\n const [isImageSelectActive, setIsImageSelectActive] = useState(false);\n\n const minZoom = useRef(minZoomProp);\n const maxZoom = useRef(maxZoomProp);\n\n useEffect(() => {\n if (hasScannerError) {\n setIsTorchSupported(false);\n setIsZoomSupported(false);\n setIsZoomed(false);\n setTrack(undefined);\n } else if (stream) {\n const videoTracks = stream.getVideoTracks();\n\n let canZoom = false;\n let canTorch = false;\n\n videoTracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n canZoom = true;\n\n const capabilities = track.getCapabilities();\n\n if (capabilities.zoom.min > minZoomProp) {\n minZoom.current = capabilities.zoom.min;\n }\n if (capabilities.zoom.max < maxZoomProp) {\n maxZoom.current = capabilities.zoom.max;\n }\n }\n if (checkTrackSupport(track, 'torch')) {\n canTorch = true;\n }\n });\n\n if (canZoom && !isZoomDisabled) {\n setIsZoomSupported(true);\n setIsZoomed(false);\n }\n\n setIsTorchSupported(canTorch && !isTorchDisabled);\n setTrack(videoTracks);\n }\n }, [\n videoConstraints,\n hasScannerError,\n stream,\n minZoomProp,\n maxZoomProp,\n isZoomDisabled,\n isTorchDisabled,\n ]);\n\n useEffect(() => {\n if (tracks?.length && isZoomSupported) {\n if (typeof previousIsZoomed === 'undefined') {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: isZoomed ? maxZoom.current : minZoom.current }],\n });\n }\n });\n } else if (previousIsZoomed !== isZoomed) {\n animateNumericValue(\n previousIsZoomed ? maxZoom.current : minZoom.current,\n isZoomed ? maxZoom.current : minZoom.current,\n 500,\n (value) => {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: value }],\n });\n }\n });\n },\n );\n }\n }\n }, [isZoomSupported, isZoomed, previousIsZoomed, tracks]);\n\n useEffect(() => {\n if (tracks?.length && isTorchSupported) {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'torch')) {\n void track.applyConstraints({\n advanced: [{ torch: isTorchActive }],\n });\n }\n });\n }\n }, [isTorchActive, isTorchSupported, tracks]);\n\n if (typeof placeholder === 'string' && placeholder.length > 0) {\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarPlaceholder>{placeholder}</StyledScannerToolbarPlaceholder>\n </StyledScannerToolbar>\n );\n }\n\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarButton\n $isAvailable={isTorchSupported}\n $isActive={isTorchActive}\n onClick={() => {\n setIsTorchActive((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-lightbulb']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={isZoomSupported}\n $isActive={isZoomed}\n onClick={() => {\n setIsZoomed((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-search-plus']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={!isFileSelectDisabled}\n $isActive={isImageSelectActive || isScanningFile}\n onClick={() => {\n setIsImageSelectActive(true);\n selectFiles({\n multiple: false,\n type: 'image/*',\n })\n .then((files) => {\n if (files && files[0]) {\n onFileSelect(files[0]);\n }\n })\n .catch(console.error)\n .finally(() => {\n setIsImageSelectActive(false);\n });\n }}\n >\n <Icon icons={['far fa-folder-image']} size={25} />\n </StyledScannerToolbarButton>\n </StyledScannerToolbar>\n );\n};\n\nexport default ScannerToolbar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.StyledScannerToolbarButton = exports.StyledScannerToolbar = void 0;
|
|
6
|
+
exports.StyledScannerToolbarPlaceholder = exports.StyledScannerToolbarButton = exports.StyledScannerToolbar = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
8
8
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
9
9
|
const StyledScannerToolbar = exports.StyledScannerToolbar = _styledComponents.default.div`
|
|
@@ -47,4 +47,17 @@ const StyledScannerToolbarButton = exports.StyledScannerToolbarButton = _styledC
|
|
|
47
47
|
color: white;
|
|
48
48
|
}
|
|
49
49
|
`;
|
|
50
|
+
const StyledScannerToolbarPlaceholder = exports.StyledScannerToolbarPlaceholder = _styledComponents.default.div`
|
|
51
|
+
font-weight: bold;
|
|
52
|
+
font-size: 20px;
|
|
53
|
+
|
|
54
|
+
text-shadow:
|
|
55
|
+
rgba(0, 0, 20, 0.9) 1px 1px 2px,
|
|
56
|
+
rgba(0, 0, 20, 0.5) 0 0 4px;
|
|
57
|
+
color: #ffffff;
|
|
58
|
+
|
|
59
|
+
display: flex;
|
|
60
|
+
align-items: end;
|
|
61
|
+
margin-bottom: -10px;
|
|
62
|
+
`;
|
|
50
63
|
//# sourceMappingURL=ScannerToolbar.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScannerToolbar.styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledScannerToolbar","exports","styled","div","StyledScannerToolbarButton","$isAvailable","css","$isActive"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nexport const StyledScannerToolbar = styled.div`\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 85px;\n padding: 20px;\n display: flex;\n justify-content: space-between;\n\n color: white;\n`;\n\ntype ScannerToolbarButtonProps = {\n $isAvailable?: boolean;\n $isActive?: boolean;\n};\n\nexport const StyledScannerToolbarButton = styled.div<ScannerToolbarButtonProps>`\n display: flex;\n justify-content: center;\n align-items: center;\n height: 45px;\n width: 45px;\n cursor: pointer;\n border-radius: 50%;\n\n ${({ $isAvailable = false }) =>\n !$isAvailable &&\n css`\n cursor: default;\n opacity: 0;\n pointer-events: none;\n `};\n\n ${({ $isActive = false }) =>\n $isActive &&\n css`\n background-color: rgba(255, 255, 255, 0.2);\n `};\n\n text-shadow: 0 0 10px black;\n\n i {\n color: white;\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEzC,MAAMkB,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOM,MAAMC,0BAA0B,GAAAH,OAAA,CAAAG,0BAAA,GAAGF,yBAAM,CAACC,GAA8B;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE,YAAY,GAAG;AAAM,CAAC,KACvB,CAACA,YAAY,IACb,IAAAC,qBAAG;AACX;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEC,SAAS,GAAG;AAAM,CAAC,KACpBA,SAAS,IACT,IAAAD,qBAAG;AACX;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ScannerToolbar.styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledScannerToolbar","exports","styled","div","StyledScannerToolbarButton","$isAvailable","css","$isActive","StyledScannerToolbarPlaceholder"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nexport const StyledScannerToolbar = styled.div`\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 85px;\n padding: 20px;\n display: flex;\n justify-content: space-between;\n\n color: white;\n`;\n\ntype ScannerToolbarButtonProps = {\n $isAvailable?: boolean;\n $isActive?: boolean;\n};\n\nexport const StyledScannerToolbarButton = styled.div<ScannerToolbarButtonProps>`\n display: flex;\n justify-content: center;\n align-items: center;\n height: 45px;\n width: 45px;\n cursor: pointer;\n border-radius: 50%;\n\n ${({ $isAvailable = false }) =>\n !$isAvailable &&\n css`\n cursor: default;\n opacity: 0;\n pointer-events: none;\n `};\n\n ${({ $isActive = false }) =>\n $isActive &&\n css`\n background-color: rgba(255, 255, 255, 0.2);\n `};\n\n text-shadow: 0 0 10px black;\n\n i {\n color: white;\n }\n`;\n\nexport const StyledScannerToolbarPlaceholder = styled.div`\n font-weight: bold;\n font-size: 20px;\n\n text-shadow:\n rgba(0, 0, 20, 0.9) 1px 1px 2px,\n rgba(0, 0, 20, 0.5) 0 0 4px;\n color: #ffffff;\n\n display: flex;\n align-items: end;\n margin-bottom: -10px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEzC,MAAMkB,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOM,MAAMC,0BAA0B,GAAAH,OAAA,CAAAG,0BAAA,GAAGF,yBAAM,CAACC,GAA8B;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE,YAAY,GAAG;AAAM,CAAC,KACvB,CAACA,YAAY,IACb,IAAAC,qBAAG;AACX;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEC,SAAS,GAAG;AAAM,CAAC,KACpBA,SAAS,IACT,IAAAD,qBAAG;AACX;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAME,+BAA+B,GAAAP,OAAA,CAAAO,+BAAA,GAAGN,yBAAM,CAACC,GAAG;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
2
2
|
import { addVisibilityChangeListener, removeVisibilityChangeListener } from 'chayns-api';
|
|
3
3
|
import { Icon, SmallWaitCursor } from '@chayns-components/core';
|
|
4
|
-
import { StyledCodeScanner, StyledCodeScannerPreview, StyledCodeScannerTextWrapper } from './CodeScanner.styles';
|
|
4
|
+
import { StyledCodeScanner, StyledCodeScannerIconOverlay, StyledCodeScannerPreview, StyledCodeScannerTextWrapper } from './CodeScanner.styles';
|
|
5
5
|
import { ScannerErrorType } from '../../types/codeScanner';
|
|
6
6
|
import { ALL_FORMATS, DEFAULT_TRACK_CONSTRAINTS, DEFAULT_VIDEO_CONSTRAINTS } from '../../constants/codeScanner';
|
|
7
7
|
import { checkTrackSupport } from '../../utils/support';
|
|
@@ -19,7 +19,9 @@ const CodeScanner = ({
|
|
|
19
19
|
isFileSelectDisabled = false,
|
|
20
20
|
isTorchDisabled = false,
|
|
21
21
|
isZoomDisabled = false,
|
|
22
|
+
shouldShowIconOverlay = false,
|
|
22
23
|
scanInterval = 250,
|
|
24
|
+
placeholder,
|
|
23
25
|
errorMessages
|
|
24
26
|
}) => {
|
|
25
27
|
const [isPolyfillLoaded, setIsPolyfillLoaded] = useState(false);
|
|
@@ -31,6 +33,10 @@ const CodeScanner = ({
|
|
|
31
33
|
const [isHandlingCode, setIsHandlingCode] = useState(false);
|
|
32
34
|
const lastCode = useRef();
|
|
33
35
|
const handleStopRef = useRef();
|
|
36
|
+
const prevValueRef = useRef({
|
|
37
|
+
value: '',
|
|
38
|
+
timestamp: 0
|
|
39
|
+
});
|
|
34
40
|
const {
|
|
35
41
|
loadQrCodeDetector
|
|
36
42
|
} = useScannerPolyfill();
|
|
@@ -49,12 +55,30 @@ const CodeScanner = ({
|
|
|
49
55
|
}, [errorMessages, scannerError]);
|
|
50
56
|
const handleScan = useCallback(code => {
|
|
51
57
|
if (!onScan) return;
|
|
58
|
+
const now = Date.now();
|
|
59
|
+
if (!prevValueRef.current) {
|
|
60
|
+
prevValueRef.current = {
|
|
61
|
+
value: '',
|
|
62
|
+
timestamp: 0
|
|
63
|
+
};
|
|
64
|
+
}
|
|
65
|
+
const {
|
|
66
|
+
value: prevValue,
|
|
67
|
+
timestamp: prevTimestamp
|
|
68
|
+
} = prevValueRef.current;
|
|
69
|
+
if (code.value === prevValue && now - prevTimestamp < scanInterval * 3) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
prevValueRef.current = {
|
|
73
|
+
value: code.value,
|
|
74
|
+
timestamp: now
|
|
75
|
+
};
|
|
52
76
|
const result = onScan(code);
|
|
53
77
|
if (result instanceof Promise) {
|
|
54
78
|
setIsHandlingCode(true);
|
|
55
79
|
void result.finally(() => setIsHandlingCode(false));
|
|
56
80
|
}
|
|
57
|
-
}, [onScan]);
|
|
81
|
+
}, [onScan, scanInterval]);
|
|
58
82
|
const handleScanResult = useCallback(result => {
|
|
59
83
|
if (!result.length) return;
|
|
60
84
|
const code = result[0];
|
|
@@ -192,7 +216,12 @@ const CodeScanner = ({
|
|
|
192
216
|
height: "100%",
|
|
193
217
|
width: "100%",
|
|
194
218
|
$isVisible: !!barcodeDetector && !errorText
|
|
195
|
-
}),
|
|
219
|
+
}), shouldShowIconOverlay && /*#__PURE__*/React.createElement(StyledCodeScannerIconOverlay, null, /*#__PURE__*/React.createElement(Icon, {
|
|
220
|
+
icons: ['ts-calling-code'],
|
|
221
|
+
color: "#ffffff",
|
|
222
|
+
size: 125
|
|
223
|
+
})), !!barcodeDetector && /*#__PURE__*/React.createElement(ScannerToolbar, {
|
|
224
|
+
placeholder: placeholder,
|
|
196
225
|
videoConstraints: videoConstraints,
|
|
197
226
|
onFileSelect: data => {
|
|
198
227
|
setIsScanningFile(true);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeScanner.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","addVisibilityChangeListener","removeVisibilityChangeListener","Icon","SmallWaitCursor","StyledCodeScanner","StyledCodeScannerPreview","StyledCodeScannerTextWrapper","ScannerErrorType","ALL_FORMATS","DEFAULT_TRACK_CONSTRAINTS","DEFAULT_VIDEO_CONSTRAINTS","checkTrackSupport","createErrorAlertDialog","ScannerToolbar","useScannerPolyfill","CodeScanner","shouldTriggerForSameCode","onScan","allowedFormats","trackConstraints","videoConstraints","minZoom","maxZoom","isFileSelectDisabled","isTorchDisabled","isZoomDisabled","scanInterval","errorMessages","isPolyfillLoaded","setIsPolyfillLoaded","videoRef","setVideoRef","barcodeDetector","setBarcodeDetector","stream","setStream","scannerError","setScannerError","undefined","isScanningFile","setIsScanningFile","isHandlingCode","setIsHandlingCode","lastCode","handleStopRef","loadQrCodeDetector","errorText","NO_CAMERA_ACCESS","noPermission","CAMERA_ALREADY_IN_USE","alreadyInUse","cameraNotAvailable","handleScan","code","result","Promise","finally","handleScanResult","length","includes","format","value","rawValue","current","handleVideoInitialization","navigator","mediaDevices","getUserMedia","res","video","e","error","name","DEVICE_NOT_FOUND","UNKNOWN","console","warn","getVideoTracks","forEach","elem","constraints","advanced","map","a","push","zoom","applyConstraints","srcObject","play","codeDetector","BarcodeDetector","formats","handleStopCameraAccess","pause","getTracks","track","stop","then","idPromise","isVisible","id","interval","setInterval","detect","clearInterval","enumerateDevices","createElement","Fragment","icons","size","color","ref","autoPlay","playsInline","height","width","$isVisible","onFileSelect","data","noCodeFound","open","hasScannerError"],"sources":["../../../../src/components/code-scanner/CodeScanner.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { addVisibilityChangeListener, removeVisibilityChangeListener } from 'chayns-api';\nimport { Icon, SmallWaitCursor } from '@chayns-components/core';\nimport {\n StyledCodeScanner,\n StyledCodeScannerPreview,\n StyledCodeScannerTextWrapper,\n} from './CodeScanner.styles';\nimport {\n CodeReaderOnScanCallback,\n ScannerErrorMessages,\n ScannerErrorType,\n} from '../../types/codeScanner';\nimport {\n ALL_FORMATS,\n DEFAULT_TRACK_CONSTRAINTS,\n DEFAULT_VIDEO_CONSTRAINTS,\n} from '../../constants/codeScanner';\nimport { checkTrackSupport } from '../../utils/support';\nimport { createErrorAlertDialog } from '../../utils/errorDialog';\nimport ScannerToolbar from './scanner-toolbar/ScannerToolbar';\nimport { useScannerPolyfill } from '../../hooks/loadscript';\n\ntype CodeScannerProps = {\n /**\n * Defines which barcode formats are allowed to be detected.\n */\n allowedFormats?: Array<BarcodeFormat>;\n /**\n * The interval of the scans.\n */\n scanInterval?: number;\n /**\n * Custom error messages for various scanner states or failures.\n */\n errorMessages: ScannerErrorMessages;\n /**\n * Disables the file select feature if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) feature if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Disables the zoom control if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback function triggered when a code is successfully scanned.\n */\n onScan?: CodeReaderOnScanCallback;\n /**\n * If true, allows scanning the same code multiple times in a row.\n */\n shouldTriggerForSameCode?: boolean;\n /**\n * Custom media track constraints for controlling the video input.\n */\n trackConstraints?: MediaTrackConstraints;\n /**\n * Additional video constraints for the camera feed.\n */\n videoConstraints?: MediaTrackConstraints;\n};\n\nconst CodeScanner: FC<CodeScannerProps> = ({\n shouldTriggerForSameCode = false,\n onScan,\n allowedFormats = ALL_FORMATS,\n trackConstraints = DEFAULT_TRACK_CONSTRAINTS,\n videoConstraints = DEFAULT_VIDEO_CONSTRAINTS,\n minZoom = 2,\n maxZoom = 10,\n isFileSelectDisabled = false,\n isTorchDisabled = false,\n isZoomDisabled = false,\n scanInterval = 250,\n errorMessages,\n}) => {\n const [isPolyfillLoaded, setIsPolyfillLoaded] = useState(false);\n const [videoRef, setVideoRef] = useState<HTMLVideoElement | null>(null);\n const [barcodeDetector, setBarcodeDetector] = useState<BarcodeDetector>();\n const [stream, setStream] = useState<MediaStream>();\n const [scannerError, setScannerError] = useState<ScannerErrorType | undefined>(undefined);\n const [isScanningFile, setIsScanningFile] = useState(false);\n const [isHandlingCode, setIsHandlingCode] = useState(false);\n const lastCode = useRef<string>();\n const handleStopRef = useRef<() => void>();\n\n const { loadQrCodeDetector } = useScannerPolyfill();\n\n const errorText = useMemo(() => {\n if (typeof scannerError === 'undefined') {\n return undefined;\n }\n\n switch (scannerError) {\n case ScannerErrorType.NO_CAMERA_ACCESS:\n return errorMessages.noPermission;\n case ScannerErrorType.CAMERA_ALREADY_IN_USE:\n return errorMessages.alreadyInUse;\n default:\n return errorMessages.cameraNotAvailable;\n }\n }, [errorMessages, scannerError]);\n\n const handleScan = useCallback(\n (code: { format: BarcodeFormat; value: string }) => {\n if (!onScan) return;\n const result = onScan(code);\n if (result instanceof Promise) {\n setIsHandlingCode(true);\n void result.finally(() => setIsHandlingCode(false));\n }\n },\n [onScan],\n );\n\n const handleScanResult = useCallback(\n (result: Array<DetectedBarcode>) => {\n if (!result.length) return;\n\n const code = result[0];\n\n if (!code) {\n return;\n }\n\n if (allowedFormats && !allowedFormats.includes(code.format)) {\n return;\n }\n\n if (shouldTriggerForSameCode) {\n handleScan({ format: code.format, value: code.rawValue });\n return;\n }\n\n if (lastCode.current && code.rawValue === lastCode.current) {\n return;\n }\n\n lastCode.current = code.rawValue;\n handleScan({ format: code.format, value: code.rawValue });\n },\n [handleScan, shouldTriggerForSameCode, allowedFormats],\n );\n\n const handleVideoInitialization = useCallback(async () => {\n if (!navigator.mediaDevices.getUserMedia || !videoRef || !isPolyfillLoaded) return;\n\n let res: MediaStream | undefined;\n\n try {\n res = await navigator.mediaDevices.getUserMedia({\n video: videoConstraints,\n });\n } catch (e) {\n const error = e as Error;\n\n if (error.name === 'NotAllowedError') {\n setScannerError(ScannerErrorType.NO_CAMERA_ACCESS);\n } else if (error.name === 'NotReadableError') {\n setScannerError(ScannerErrorType.CAMERA_ALREADY_IN_USE);\n } else if (error.name === 'NotFoundError') {\n setScannerError(ScannerErrorType.DEVICE_NOT_FOUND);\n } else {\n setScannerError(ScannerErrorType.UNKNOWN);\n console.warn(e);\n }\n }\n\n if (res) {\n res.getVideoTracks().forEach((elem) => {\n const constraints = {\n ...trackConstraints,\n advanced: trackConstraints.advanced?.map((a) => ({ ...a })) || [],\n };\n\n if (checkTrackSupport(elem, 'zoom')) {\n constraints.advanced.push({ zoom: minZoom });\n }\n\n void elem.applyConstraints(constraints);\n });\n\n setStream(res);\n\n videoRef.srcObject = res;\n\n await videoRef.play();\n }\n\n const codeDetector = new BarcodeDetector(\n allowedFormats ? { formats: allowedFormats } : undefined,\n );\n\n setBarcodeDetector(codeDetector);\n }, [isPolyfillLoaded, minZoom, trackConstraints, allowedFormats, videoConstraints, videoRef]);\n\n const handleStopCameraAccess = useCallback(() => {\n if (videoRef) {\n videoRef.pause();\n }\n\n if (barcodeDetector) {\n setBarcodeDetector(undefined);\n }\n\n if (stream) {\n stream.getTracks().forEach((track) => track.stop());\n setStream(undefined);\n }\n }, [barcodeDetector, stream, videoRef]);\n\n // Load BarCodeDetector\n useEffect(() => {\n void loadQrCodeDetector().then(() => {\n setIsPolyfillLoaded(true);\n });\n\n return () => {\n if (handleStopRef.current) handleStopRef.current();\n };\n }, [loadQrCodeDetector]);\n\n useEffect(() => {\n handleStopRef.current = handleStopCameraAccess;\n }, [handleStopCameraAccess]);\n\n useEffect(() => {\n const idPromise = addVisibilityChangeListener(({ isVisible }) => {\n if (!isVisible) {\n handleStopCameraAccess();\n } else {\n void handleVideoInitialization();\n }\n });\n\n return () => {\n void idPromise.then((id) => {\n void removeVisibilityChangeListener(id);\n });\n };\n }, [handleStopCameraAccess, handleVideoInitialization]);\n\n useEffect(() => {\n if (!barcodeDetector || !videoRef) return undefined;\n\n if (!isScanningFile && !isHandlingCode) {\n const interval = setInterval(() => {\n void barcodeDetector.detect(videoRef).then(handleScanResult);\n }, scanInterval);\n\n return () => clearInterval(interval);\n }\n\n return undefined;\n }, [barcodeDetector, handleScanResult, isHandlingCode, isScanningFile, videoRef, scanInterval]);\n\n useEffect(() => {\n if (\n !navigator.mediaDevices.enumerateDevices ||\n !navigator.mediaDevices.getUserMedia ||\n !videoRef ||\n !isPolyfillLoaded\n ) {\n return;\n }\n\n void handleVideoInitialization();\n }, [handleVideoInitialization, isPolyfillLoaded, videoRef]);\n\n return (\n <StyledCodeScanner>\n {(!barcodeDetector || errorText) && (\n <StyledCodeScannerTextWrapper>\n {!barcodeDetector && !errorText && <SmallWaitCursor />}\n {errorText && (\n <>\n <Icon\n icons={['fa fa-webcam-slash']}\n size={40}\n color=\"rgb(128, 128, 128)\"\n />\n {errorText}\n </>\n )}\n </StyledCodeScannerTextWrapper>\n )}\n <StyledCodeScannerPreview\n ref={setVideoRef}\n autoPlay\n playsInline\n height=\"100%\"\n width=\"100%\"\n $isVisible={!!barcodeDetector && !errorText}\n />\n {!!barcodeDetector && (\n <ScannerToolbar\n videoConstraints={videoConstraints}\n onFileSelect={(data) => {\n setIsScanningFile(true);\n\n void barcodeDetector\n .detect(data)\n .then((value) => {\n if (value.length) {\n handleScanResult(value);\n } else {\n void createErrorAlertDialog(errorMessages.noCodeFound).open();\n }\n })\n .finally(() => setIsScanningFile(false));\n }}\n isScanningFile={isScanningFile}\n hasScannerError={typeof scannerError !== 'undefined'}\n stream={stream}\n minZoom={minZoom}\n maxZoom={maxZoom}\n isZoomDisabled={isZoomDisabled}\n isTorchDisabled={isTorchDisabled}\n isFileSelectDisabled={isFileSelectDisabled}\n />\n )}\n </StyledCodeScanner>\n );\n};\n\nexport default CodeScanner;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"CodeScanner.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","addVisibilityChangeListener","removeVisibilityChangeListener","Icon","SmallWaitCursor","StyledCodeScanner","StyledCodeScannerIconOverlay","StyledCodeScannerPreview","StyledCodeScannerTextWrapper","ScannerErrorType","ALL_FORMATS","DEFAULT_TRACK_CONSTRAINTS","DEFAULT_VIDEO_CONSTRAINTS","checkTrackSupport","createErrorAlertDialog","ScannerToolbar","useScannerPolyfill","CodeScanner","shouldTriggerForSameCode","onScan","allowedFormats","trackConstraints","videoConstraints","minZoom","maxZoom","isFileSelectDisabled","isTorchDisabled","isZoomDisabled","shouldShowIconOverlay","scanInterval","placeholder","errorMessages","isPolyfillLoaded","setIsPolyfillLoaded","videoRef","setVideoRef","barcodeDetector","setBarcodeDetector","stream","setStream","scannerError","setScannerError","undefined","isScanningFile","setIsScanningFile","isHandlingCode","setIsHandlingCode","lastCode","handleStopRef","prevValueRef","value","timestamp","loadQrCodeDetector","errorText","NO_CAMERA_ACCESS","noPermission","CAMERA_ALREADY_IN_USE","alreadyInUse","cameraNotAvailable","handleScan","code","now","Date","current","prevValue","prevTimestamp","result","Promise","finally","handleScanResult","length","includes","format","rawValue","handleVideoInitialization","navigator","mediaDevices","getUserMedia","res","video","e","error","name","DEVICE_NOT_FOUND","UNKNOWN","console","warn","getVideoTracks","forEach","elem","constraints","advanced","map","a","push","zoom","applyConstraints","srcObject","play","codeDetector","BarcodeDetector","formats","handleStopCameraAccess","pause","getTracks","track","stop","then","idPromise","isVisible","id","interval","setInterval","detect","clearInterval","enumerateDevices","createElement","Fragment","icons","size","color","ref","autoPlay","playsInline","height","width","$isVisible","onFileSelect","data","noCodeFound","open","hasScannerError"],"sources":["../../../../src/components/code-scanner/CodeScanner.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { addVisibilityChangeListener, removeVisibilityChangeListener } from 'chayns-api';\nimport { Icon, SmallWaitCursor } from '@chayns-components/core';\nimport {\n StyledCodeScanner,\n StyledCodeScannerIconOverlay,\n StyledCodeScannerPreview,\n StyledCodeScannerTextWrapper,\n} from './CodeScanner.styles';\nimport {\n CodeReaderOnScanCallback,\n ScannerErrorMessages,\n ScannerErrorType,\n} from '../../types/codeScanner';\nimport {\n ALL_FORMATS,\n DEFAULT_TRACK_CONSTRAINTS,\n DEFAULT_VIDEO_CONSTRAINTS,\n} from '../../constants/codeScanner';\nimport { checkTrackSupport } from '../../utils/support';\nimport { createErrorAlertDialog } from '../../utils/errorDialog';\nimport ScannerToolbar from './scanner-toolbar/ScannerToolbar';\nimport { useScannerPolyfill } from '../../hooks/loadscript';\n\ntype CodeScannerProps = {\n /**\n * Defines which barcode formats are allowed to be detected.\n */\n allowedFormats?: Array<BarcodeFormat>;\n /**\n * The interval of the scans.\n */\n scanInterval?: number;\n /**\n * Custom error messages for various scanner states or failures.\n */\n errorMessages: ScannerErrorMessages;\n /**\n * Disables the file select feature if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) feature if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Disables the zoom control if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * A placeholder that should be displayed inside the preview.\n */\n placeholder?: string;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback function triggered when a code is successfully scanned.\n */\n onScan?: CodeReaderOnScanCallback;\n /**\n * Whether a calling code icon should be displayed as an overlay.\n */\n shouldShowIconOverlay?: boolean;\n /**\n * If true, allows scanning the same code multiple times in a row.\n */\n shouldTriggerForSameCode?: boolean;\n /**\n * Custom media track constraints for controlling the video input.\n */\n trackConstraints?: MediaTrackConstraints;\n /**\n * Additional video constraints for the camera feed.\n */\n videoConstraints?: MediaTrackConstraints;\n};\n\nconst CodeScanner: FC<CodeScannerProps> = ({\n shouldTriggerForSameCode = false,\n onScan,\n allowedFormats = ALL_FORMATS,\n trackConstraints = DEFAULT_TRACK_CONSTRAINTS,\n videoConstraints = DEFAULT_VIDEO_CONSTRAINTS,\n minZoom = 2,\n maxZoom = 10,\n isFileSelectDisabled = false,\n isTorchDisabled = false,\n isZoomDisabled = false,\n shouldShowIconOverlay = false,\n scanInterval = 250,\n placeholder,\n errorMessages,\n}) => {\n const [isPolyfillLoaded, setIsPolyfillLoaded] = useState(false);\n const [videoRef, setVideoRef] = useState<HTMLVideoElement | null>(null);\n const [barcodeDetector, setBarcodeDetector] = useState<BarcodeDetector>();\n const [stream, setStream] = useState<MediaStream>();\n const [scannerError, setScannerError] = useState<ScannerErrorType | undefined>(undefined);\n const [isScanningFile, setIsScanningFile] = useState(false);\n const [isHandlingCode, setIsHandlingCode] = useState(false);\n const lastCode = useRef<string>();\n const handleStopRef = useRef<() => void>();\n const prevValueRef = useRef<{ value: string; timestamp: number }>({\n value: '',\n timestamp: 0,\n });\n\n const { loadQrCodeDetector } = useScannerPolyfill();\n\n const errorText = useMemo(() => {\n if (typeof scannerError === 'undefined') {\n return undefined;\n }\n\n switch (scannerError) {\n case ScannerErrorType.NO_CAMERA_ACCESS:\n return errorMessages.noPermission;\n case ScannerErrorType.CAMERA_ALREADY_IN_USE:\n return errorMessages.alreadyInUse;\n default:\n return errorMessages.cameraNotAvailable;\n }\n }, [errorMessages, scannerError]);\n\n const handleScan = useCallback(\n (code: { format: BarcodeFormat; value: string }) => {\n if (!onScan) return;\n\n const now = Date.now();\n\n if (!prevValueRef.current) {\n prevValueRef.current = { value: '', timestamp: 0 };\n }\n\n const { value: prevValue, timestamp: prevTimestamp } = prevValueRef.current;\n\n if (code.value === prevValue && now - prevTimestamp < scanInterval * 3) {\n return;\n }\n\n prevValueRef.current = { value: code.value, timestamp: now };\n\n const result = onScan(code);\n if (result instanceof Promise) {\n setIsHandlingCode(true);\n void result.finally(() => setIsHandlingCode(false));\n }\n },\n [onScan, scanInterval],\n );\n\n const handleScanResult = useCallback(\n (result: Array<DetectedBarcode>) => {\n if (!result.length) return;\n\n const code = result[0];\n\n if (!code) {\n return;\n }\n\n if (allowedFormats && !allowedFormats.includes(code.format)) {\n return;\n }\n\n if (shouldTriggerForSameCode) {\n handleScan({ format: code.format, value: code.rawValue });\n return;\n }\n\n if (lastCode.current && code.rawValue === lastCode.current) {\n return;\n }\n\n lastCode.current = code.rawValue;\n handleScan({ format: code.format, value: code.rawValue });\n },\n [handleScan, shouldTriggerForSameCode, allowedFormats],\n );\n\n const handleVideoInitialization = useCallback(async () => {\n if (!navigator.mediaDevices.getUserMedia || !videoRef || !isPolyfillLoaded) return;\n\n let res: MediaStream | undefined;\n\n try {\n res = await navigator.mediaDevices.getUserMedia({\n video: videoConstraints,\n });\n } catch (e) {\n const error = e as Error;\n\n if (error.name === 'NotAllowedError') {\n setScannerError(ScannerErrorType.NO_CAMERA_ACCESS);\n } else if (error.name === 'NotReadableError') {\n setScannerError(ScannerErrorType.CAMERA_ALREADY_IN_USE);\n } else if (error.name === 'NotFoundError') {\n setScannerError(ScannerErrorType.DEVICE_NOT_FOUND);\n } else {\n setScannerError(ScannerErrorType.UNKNOWN);\n console.warn(e);\n }\n }\n\n if (res) {\n res.getVideoTracks().forEach((elem) => {\n const constraints = {\n ...trackConstraints,\n advanced: trackConstraints.advanced?.map((a) => ({ ...a })) || [],\n };\n\n if (checkTrackSupport(elem, 'zoom')) {\n constraints.advanced.push({ zoom: minZoom });\n }\n\n void elem.applyConstraints(constraints);\n });\n\n setStream(res);\n\n videoRef.srcObject = res;\n\n await videoRef.play();\n }\n\n const codeDetector = new BarcodeDetector(\n allowedFormats ? { formats: allowedFormats } : undefined,\n );\n\n setBarcodeDetector(codeDetector);\n }, [isPolyfillLoaded, minZoom, trackConstraints, allowedFormats, videoConstraints, videoRef]);\n\n const handleStopCameraAccess = useCallback(() => {\n if (videoRef) {\n videoRef.pause();\n }\n\n if (barcodeDetector) {\n setBarcodeDetector(undefined);\n }\n\n if (stream) {\n stream.getTracks().forEach((track) => track.stop());\n setStream(undefined);\n }\n }, [barcodeDetector, stream, videoRef]);\n\n // Load BarCodeDetector\n useEffect(() => {\n void loadQrCodeDetector().then(() => {\n setIsPolyfillLoaded(true);\n });\n\n return () => {\n if (handleStopRef.current) handleStopRef.current();\n };\n }, [loadQrCodeDetector]);\n\n useEffect(() => {\n handleStopRef.current = handleStopCameraAccess;\n }, [handleStopCameraAccess]);\n\n useEffect(() => {\n const idPromise = addVisibilityChangeListener(({ isVisible }) => {\n if (!isVisible) {\n handleStopCameraAccess();\n } else {\n void handleVideoInitialization();\n }\n });\n\n return () => {\n void idPromise.then((id) => {\n void removeVisibilityChangeListener(id);\n });\n };\n }, [handleStopCameraAccess, handleVideoInitialization]);\n\n useEffect(() => {\n if (!barcodeDetector || !videoRef) return undefined;\n\n if (!isScanningFile && !isHandlingCode) {\n const interval = setInterval(() => {\n void barcodeDetector.detect(videoRef).then(handleScanResult);\n }, scanInterval);\n\n return () => clearInterval(interval);\n }\n\n return undefined;\n }, [barcodeDetector, handleScanResult, isHandlingCode, isScanningFile, videoRef, scanInterval]);\n\n useEffect(() => {\n if (\n !navigator.mediaDevices.enumerateDevices ||\n !navigator.mediaDevices.getUserMedia ||\n !videoRef ||\n !isPolyfillLoaded\n ) {\n return;\n }\n\n void handleVideoInitialization();\n }, [handleVideoInitialization, isPolyfillLoaded, videoRef]);\n\n return (\n <StyledCodeScanner>\n {(!barcodeDetector || errorText) && (\n <StyledCodeScannerTextWrapper>\n {!barcodeDetector && !errorText && <SmallWaitCursor />}\n {errorText && (\n <>\n <Icon\n icons={['fa fa-webcam-slash']}\n size={40}\n color=\"rgb(128, 128, 128)\"\n />\n {errorText}\n </>\n )}\n </StyledCodeScannerTextWrapper>\n )}\n <StyledCodeScannerPreview\n ref={setVideoRef}\n autoPlay\n playsInline\n height=\"100%\"\n width=\"100%\"\n $isVisible={!!barcodeDetector && !errorText}\n />\n {shouldShowIconOverlay && (\n <StyledCodeScannerIconOverlay>\n <Icon icons={['ts-calling-code']} color=\"#ffffff\" size={125} />\n </StyledCodeScannerIconOverlay>\n )}\n {!!barcodeDetector && (\n <ScannerToolbar\n placeholder={placeholder}\n videoConstraints={videoConstraints}\n onFileSelect={(data) => {\n setIsScanningFile(true);\n\n void barcodeDetector\n .detect(data)\n .then((value) => {\n if (value.length) {\n handleScanResult(value);\n } else {\n void createErrorAlertDialog(errorMessages.noCodeFound).open();\n }\n })\n .finally(() => setIsScanningFile(false));\n }}\n isScanningFile={isScanningFile}\n hasScannerError={typeof scannerError !== 'undefined'}\n stream={stream}\n minZoom={minZoom}\n maxZoom={maxZoom}\n isZoomDisabled={isZoomDisabled}\n isTorchDisabled={isTorchDisabled}\n isFileSelectDisabled={isFileSelectDisabled}\n />\n )}\n </StyledCodeScanner>\n );\n};\n\nexport default CodeScanner;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -3,6 +3,7 @@ export const StyledCodeScanner = styled.div`
|
|
|
3
3
|
display: flex;
|
|
4
4
|
justify-content: center;
|
|
5
5
|
align-items: center;
|
|
6
|
+
position: relative;
|
|
6
7
|
`;
|
|
7
8
|
export const StyledCodeScannerTextWrapper = styled.div`
|
|
8
9
|
width: 640px;
|
|
@@ -24,4 +25,11 @@ export const StyledCodeScannerPreview = styled.video`
|
|
|
24
25
|
display: none;
|
|
25
26
|
`}
|
|
26
27
|
`;
|
|
28
|
+
export const StyledCodeScannerIconOverlay = styled.div`
|
|
29
|
+
opacity: 0.7;
|
|
30
|
+
position: absolute;
|
|
31
|
+
top: 50%;
|
|
32
|
+
left: 50%;
|
|
33
|
+
transform: translate(-50%, -50%);
|
|
34
|
+
`;
|
|
27
35
|
//# sourceMappingURL=CodeScanner.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeScanner.styles.js","names":["styled","StyledCodeScanner","div","StyledCodeScannerTextWrapper","StyledCodeScannerPreview","video","$isVisible"],"sources":["../../../../src/components/code-scanner/CodeScanner.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledCodeScanner = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\ntype StyledCodeScannerPreviewProps = {\n $isVisible: boolean;\n};\n\nexport const StyledCodeScannerTextWrapper = styled.div`\n width: 640px;\n display: flex;\n justify-content: center;\n align-items: center;\n aspect-ratio: 3 / 2;\n flex-direction: column;\n text-align: center;\n padding: 20px;\n`;\n\nexport const StyledCodeScannerPreview = styled.video<StyledCodeScannerPreviewProps>`\n width: 100%;\n height: 100%;\n\n ${({ $isVisible }) =>\n !$isVisible &&\n `\n display: none;\n `}\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,iBAAiB,GAAGD,MAAM,CAACE,GAAG;AAC3C;AACA;AACA;AACA,CAAC;AAMD,OAAO,MAAMC,4BAA4B,GAAGH,MAAM,CAACE,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAME,wBAAwB,GAAGJ,MAAM,CAACK,KAAoC;AACnF;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,CAACA,UAAU,IACX;AACR;AACA,KAAK;AACL,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"CodeScanner.styles.js","names":["styled","StyledCodeScanner","div","StyledCodeScannerTextWrapper","StyledCodeScannerPreview","video","$isVisible","StyledCodeScannerIconOverlay"],"sources":["../../../../src/components/code-scanner/CodeScanner.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledCodeScanner = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n`;\n\ntype StyledCodeScannerPreviewProps = {\n $isVisible: boolean;\n};\n\nexport const StyledCodeScannerTextWrapper = styled.div`\n width: 640px;\n display: flex;\n justify-content: center;\n align-items: center;\n aspect-ratio: 3 / 2;\n flex-direction: column;\n text-align: center;\n padding: 20px;\n`;\n\nexport const StyledCodeScannerPreview = styled.video<StyledCodeScannerPreviewProps>`\n width: 100%;\n height: 100%;\n\n ${({ $isVisible }) =>\n !$isVisible &&\n `\n display: none;\n `}\n`;\n\nexport const StyledCodeScannerIconOverlay = styled.div`\n opacity: 0.7;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,iBAAiB,GAAGD,MAAM,CAACE,GAAG;AAC3C;AACA;AACA;AACA;AACA,CAAC;AAMD,OAAO,MAAMC,4BAA4B,GAAGH,MAAM,CAACE,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAME,wBAAwB,GAAGJ,MAAM,CAACK,KAAoC;AACnF;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAW,CAAC,KACb,CAACA,UAAU,IACX;AACR;AACA,KAAK;AACL,CAAC;AAED,OAAO,MAAMC,4BAA4B,GAAGP,MAAM,CAACE,GAAG;AACtD;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useEffect, useRef, useState } from 'react';
|
|
2
2
|
import { Icon, selectFiles } from '@chayns-components/core';
|
|
3
|
-
import { StyledScannerToolbar, StyledScannerToolbarButton } from './ScannerToolbar.styles';
|
|
3
|
+
import { StyledScannerToolbar, StyledScannerToolbarButton, StyledScannerToolbarPlaceholder } from './ScannerToolbar.styles';
|
|
4
4
|
import { checkTrackSupport } from '../../../utils/support';
|
|
5
5
|
import { animateNumericValue } from '../../../utils/animate';
|
|
6
6
|
import usePrevious from '../../../hooks/codeScanner';
|
|
@@ -13,6 +13,7 @@ const ScannerToolbar = ({
|
|
|
13
13
|
minZoom: minZoomProp = 1,
|
|
14
14
|
maxZoom: maxZoomProp = 3,
|
|
15
15
|
isZoomDisabled = false,
|
|
16
|
+
placeholder,
|
|
16
17
|
isTorchDisabled = false,
|
|
17
18
|
isFileSelectDisabled = false
|
|
18
19
|
}) => {
|
|
@@ -98,6 +99,9 @@ const ScannerToolbar = ({
|
|
|
98
99
|
});
|
|
99
100
|
}
|
|
100
101
|
}, [isTorchActive, isTorchSupported, tracks]);
|
|
102
|
+
if (typeof placeholder === 'string' && placeholder.length > 0) {
|
|
103
|
+
return /*#__PURE__*/React.createElement(StyledScannerToolbar, null, /*#__PURE__*/React.createElement(StyledScannerToolbarPlaceholder, null, placeholder));
|
|
104
|
+
}
|
|
101
105
|
return /*#__PURE__*/React.createElement(StyledScannerToolbar, null, /*#__PURE__*/React.createElement(StyledScannerToolbarButton, {
|
|
102
106
|
$isAvailable: isTorchSupported,
|
|
103
107
|
$isActive: isTorchActive,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScannerToolbar.js","names":["React","useEffect","useRef","useState","Icon","selectFiles","StyledScannerToolbar","StyledScannerToolbarButton","checkTrackSupport","animateNumericValue","usePrevious","ScannerToolbar","videoConstraints","onFileSelect","isScanningFile","hasScannerError","stream","minZoom","minZoomProp","maxZoom","maxZoomProp","isZoomDisabled","isTorchDisabled","isFileSelectDisabled","tracks","setTrack","isZoomed","setIsZoomed","previousIsZoomed","isZoomSupported","setIsZoomSupported","isTorchActive","setIsTorchActive","isTorchSupported","setIsTorchSupported","isImageSelectActive","setIsImageSelectActive","undefined","videoTracks","getVideoTracks","canZoom","canTorch","forEach","track","capabilities","getCapabilities","zoom","min","current","max","length","applyConstraints","advanced","value","torch","createElement","$isAvailable","$isActive","onClick","prev","icons","size","multiple","type","then","files","catch","console","error","finally"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { Icon, selectFiles } from '@chayns-components/core';\nimport { StyledScannerToolbar, StyledScannerToolbarButton } from './ScannerToolbar.styles';\nimport { checkTrackSupport } from '../../../utils/support';\nimport { animateNumericValue } from '../../../utils/animate';\nimport usePrevious from '../../../hooks/codeScanner';\n\ntype ScannerToolbarProps = {\n /**\n * Indicates whether the scanner currently has an active error.\n */\n hasScannerError?: boolean;\n /**\n * Disables the file select option if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) button if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Indicates if a file is currently being scanned.\n */\n isScanningFile: boolean;\n /**\n * Disables the zoom slider if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback triggered when a file is selected for scanning.\n */\n onFileSelect: (file: File) => void;\n /**\n * The active media stream used by the scanner.\n */\n stream?: MediaStream;\n /**\n * Defines constraints for the video element, e.g., resolution or facing mode.\n */\n videoConstraints: MediaTrackConstraints;\n};\n\nconst ScannerToolbar: FC<ScannerToolbarProps> = ({\n videoConstraints,\n onFileSelect,\n isScanningFile,\n hasScannerError = false,\n stream,\n minZoom: minZoomProp = 1,\n maxZoom: maxZoomProp = 3,\n isZoomDisabled = false,\n isTorchDisabled = false,\n isFileSelectDisabled = false,\n}) => {\n const [tracks, setTrack] = useState<MediaStreamTrack[]>();\n const [isZoomed, setIsZoomed] = useState<boolean>();\n const previousIsZoomed = usePrevious(isZoomed);\n const [isZoomSupported, setIsZoomSupported] = useState(false);\n const [isTorchActive, setIsTorchActive] = useState(false);\n const [isTorchSupported, setIsTorchSupported] = useState(false);\n const [isImageSelectActive, setIsImageSelectActive] = useState(false);\n\n const minZoom = useRef(minZoomProp);\n const maxZoom = useRef(maxZoomProp);\n\n useEffect(() => {\n if (hasScannerError) {\n setIsTorchSupported(false);\n setIsZoomSupported(false);\n setIsZoomed(false);\n setTrack(undefined);\n } else if (stream) {\n const videoTracks = stream.getVideoTracks();\n\n let canZoom = false;\n let canTorch = false;\n\n videoTracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n canZoom = true;\n\n const capabilities = track.getCapabilities();\n\n if (capabilities.zoom.min > minZoomProp) {\n minZoom.current = capabilities.zoom.min;\n }\n if (capabilities.zoom.max < maxZoomProp) {\n maxZoom.current = capabilities.zoom.max;\n }\n }\n if (checkTrackSupport(track, 'torch')) {\n canTorch = true;\n }\n });\n\n if (canZoom && !isZoomDisabled) {\n setIsZoomSupported(true);\n setIsZoomed(false);\n }\n\n setIsTorchSupported(canTorch && !isTorchDisabled);\n setTrack(videoTracks);\n }\n }, [\n videoConstraints,\n hasScannerError,\n stream,\n minZoomProp,\n maxZoomProp,\n isZoomDisabled,\n isTorchDisabled,\n ]);\n\n useEffect(() => {\n if (tracks?.length && isZoomSupported) {\n if (typeof previousIsZoomed === 'undefined') {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: isZoomed ? maxZoom.current : minZoom.current }],\n });\n }\n });\n } else if (previousIsZoomed !== isZoomed) {\n animateNumericValue(\n previousIsZoomed ? maxZoom.current : minZoom.current,\n isZoomed ? maxZoom.current : minZoom.current,\n 500,\n (value) => {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: value }],\n });\n }\n });\n },\n );\n }\n }\n }, [isZoomSupported, isZoomed, previousIsZoomed, tracks]);\n\n useEffect(() => {\n if (tracks?.length && isTorchSupported) {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'torch')) {\n void track.applyConstraints({\n advanced: [{ torch: isTorchActive }],\n });\n }\n });\n }\n }, [isTorchActive, isTorchSupported, tracks]);\n\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarButton\n $isAvailable={isTorchSupported}\n $isActive={isTorchActive}\n onClick={() => {\n setIsTorchActive((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-lightbulb']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={isZoomSupported}\n $isActive={isZoomed}\n onClick={() => {\n setIsZoomed((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-search-plus']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={!isFileSelectDisabled}\n $isActive={isImageSelectActive || isScanningFile}\n onClick={() => {\n setIsImageSelectActive(true);\n selectFiles({\n multiple: false,\n type: 'image/*',\n })\n .then((files) => {\n if (files && files[0]) {\n onFileSelect(files[0]);\n }\n })\n .catch(console.error)\n .finally(() => {\n setIsImageSelectActive(false);\n });\n }}\n >\n <Icon icons={['far fa-folder-image']} size={25} />\n </StyledScannerToolbarButton>\n </StyledScannerToolbar>\n );\n};\n\nexport default ScannerToolbar;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ScannerToolbar.js","names":["React","useEffect","useRef","useState","Icon","selectFiles","StyledScannerToolbar","StyledScannerToolbarButton","StyledScannerToolbarPlaceholder","checkTrackSupport","animateNumericValue","usePrevious","ScannerToolbar","videoConstraints","onFileSelect","isScanningFile","hasScannerError","stream","minZoom","minZoomProp","maxZoom","maxZoomProp","isZoomDisabled","placeholder","isTorchDisabled","isFileSelectDisabled","tracks","setTrack","isZoomed","setIsZoomed","previousIsZoomed","isZoomSupported","setIsZoomSupported","isTorchActive","setIsTorchActive","isTorchSupported","setIsTorchSupported","isImageSelectActive","setIsImageSelectActive","undefined","videoTracks","getVideoTracks","canZoom","canTorch","forEach","track","capabilities","getCapabilities","zoom","min","current","max","length","applyConstraints","advanced","value","torch","createElement","$isAvailable","$isActive","onClick","prev","icons","size","multiple","type","then","files","catch","console","error","finally"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { Icon, selectFiles } from '@chayns-components/core';\nimport {\n StyledScannerToolbar,\n StyledScannerToolbarButton,\n StyledScannerToolbarPlaceholder,\n} from './ScannerToolbar.styles';\nimport { checkTrackSupport } from '../../../utils/support';\nimport { animateNumericValue } from '../../../utils/animate';\nimport usePrevious from '../../../hooks/codeScanner';\n\ntype ScannerToolbarProps = {\n /**\n * Indicates whether the scanner currently has an active error.\n */\n hasScannerError?: boolean;\n /**\n * Disables the file select option if set to true.\n */\n isFileSelectDisabled?: boolean;\n /**\n * Disables the torch (flashlight) button if set to true.\n */\n isTorchDisabled?: boolean;\n /**\n * Indicates if a file is currently being scanned.\n */\n isScanningFile: boolean;\n /**\n * Disables the zoom slider if set to true.\n */\n isZoomDisabled?: boolean;\n /**\n * A placeholder that should be displayed inside the preview.\n */\n placeholder?: string;\n /**\n * Maximum allowed zoom level for the camera.\n */\n maxZoom?: number;\n /**\n * Minimum allowed zoom level for the camera.\n */\n minZoom?: number;\n /**\n * Callback triggered when a file is selected for scanning.\n */\n onFileSelect: (file: File) => void;\n /**\n * The active media stream used by the scanner.\n */\n stream?: MediaStream;\n /**\n * Defines constraints for the video element, e.g., resolution or facing mode.\n */\n videoConstraints: MediaTrackConstraints;\n};\n\nconst ScannerToolbar: FC<ScannerToolbarProps> = ({\n videoConstraints,\n onFileSelect,\n isScanningFile,\n hasScannerError = false,\n stream,\n minZoom: minZoomProp = 1,\n maxZoom: maxZoomProp = 3,\n isZoomDisabled = false,\n placeholder,\n isTorchDisabled = false,\n isFileSelectDisabled = false,\n}) => {\n const [tracks, setTrack] = useState<MediaStreamTrack[]>();\n const [isZoomed, setIsZoomed] = useState<boolean>();\n const previousIsZoomed = usePrevious(isZoomed);\n const [isZoomSupported, setIsZoomSupported] = useState(false);\n const [isTorchActive, setIsTorchActive] = useState(false);\n const [isTorchSupported, setIsTorchSupported] = useState(false);\n const [isImageSelectActive, setIsImageSelectActive] = useState(false);\n\n const minZoom = useRef(minZoomProp);\n const maxZoom = useRef(maxZoomProp);\n\n useEffect(() => {\n if (hasScannerError) {\n setIsTorchSupported(false);\n setIsZoomSupported(false);\n setIsZoomed(false);\n setTrack(undefined);\n } else if (stream) {\n const videoTracks = stream.getVideoTracks();\n\n let canZoom = false;\n let canTorch = false;\n\n videoTracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n canZoom = true;\n\n const capabilities = track.getCapabilities();\n\n if (capabilities.zoom.min > minZoomProp) {\n minZoom.current = capabilities.zoom.min;\n }\n if (capabilities.zoom.max < maxZoomProp) {\n maxZoom.current = capabilities.zoom.max;\n }\n }\n if (checkTrackSupport(track, 'torch')) {\n canTorch = true;\n }\n });\n\n if (canZoom && !isZoomDisabled) {\n setIsZoomSupported(true);\n setIsZoomed(false);\n }\n\n setIsTorchSupported(canTorch && !isTorchDisabled);\n setTrack(videoTracks);\n }\n }, [\n videoConstraints,\n hasScannerError,\n stream,\n minZoomProp,\n maxZoomProp,\n isZoomDisabled,\n isTorchDisabled,\n ]);\n\n useEffect(() => {\n if (tracks?.length && isZoomSupported) {\n if (typeof previousIsZoomed === 'undefined') {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: isZoomed ? maxZoom.current : minZoom.current }],\n });\n }\n });\n } else if (previousIsZoomed !== isZoomed) {\n animateNumericValue(\n previousIsZoomed ? maxZoom.current : minZoom.current,\n isZoomed ? maxZoom.current : minZoom.current,\n 500,\n (value) => {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'zoom')) {\n void track.applyConstraints({\n advanced: [{ zoom: value }],\n });\n }\n });\n },\n );\n }\n }\n }, [isZoomSupported, isZoomed, previousIsZoomed, tracks]);\n\n useEffect(() => {\n if (tracks?.length && isTorchSupported) {\n tracks.forEach((track) => {\n if (checkTrackSupport(track, 'torch')) {\n void track.applyConstraints({\n advanced: [{ torch: isTorchActive }],\n });\n }\n });\n }\n }, [isTorchActive, isTorchSupported, tracks]);\n\n if (typeof placeholder === 'string' && placeholder.length > 0) {\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarPlaceholder>{placeholder}</StyledScannerToolbarPlaceholder>\n </StyledScannerToolbar>\n );\n }\n\n return (\n <StyledScannerToolbar>\n <StyledScannerToolbarButton\n $isAvailable={isTorchSupported}\n $isActive={isTorchActive}\n onClick={() => {\n setIsTorchActive((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-lightbulb']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={isZoomSupported}\n $isActive={isZoomed}\n onClick={() => {\n setIsZoomed((prev) => !prev);\n }}\n >\n <Icon icons={['far fa-search-plus']} size={25} />\n </StyledScannerToolbarButton>\n <StyledScannerToolbarButton\n $isAvailable={!isFileSelectDisabled}\n $isActive={isImageSelectActive || isScanningFile}\n onClick={() => {\n setIsImageSelectActive(true);\n selectFiles({\n multiple: false,\n type: 'image/*',\n })\n .then((files) => {\n if (files && files[0]) {\n onFileSelect(files[0]);\n }\n })\n .catch(console.error)\n .finally(() => {\n setIsImageSelectActive(false);\n });\n }}\n >\n <Icon icons={['far fa-folder-image']} size={25} />\n </StyledScannerToolbarButton>\n </StyledScannerToolbar>\n );\n};\n\nexport default ScannerToolbar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -40,4 +40,17 @@ export const StyledScannerToolbarButton = styled.div`
|
|
|
40
40
|
color: white;
|
|
41
41
|
}
|
|
42
42
|
`;
|
|
43
|
+
export const StyledScannerToolbarPlaceholder = styled.div`
|
|
44
|
+
font-weight: bold;
|
|
45
|
+
font-size: 20px;
|
|
46
|
+
|
|
47
|
+
text-shadow:
|
|
48
|
+
rgba(0, 0, 20, 0.9) 1px 1px 2px,
|
|
49
|
+
rgba(0, 0, 20, 0.5) 0 0 4px;
|
|
50
|
+
color: #ffffff;
|
|
51
|
+
|
|
52
|
+
display: flex;
|
|
53
|
+
align-items: end;
|
|
54
|
+
margin-bottom: -10px;
|
|
55
|
+
`;
|
|
43
56
|
//# sourceMappingURL=ScannerToolbar.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScannerToolbar.styles.js","names":["styled","css","StyledScannerToolbar","div","StyledScannerToolbarButton","$isAvailable","$isActive"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nexport const StyledScannerToolbar = styled.div`\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 85px;\n padding: 20px;\n display: flex;\n justify-content: space-between;\n\n color: white;\n`;\n\ntype ScannerToolbarButtonProps = {\n $isAvailable?: boolean;\n $isActive?: boolean;\n};\n\nexport const StyledScannerToolbarButton = styled.div<ScannerToolbarButtonProps>`\n display: flex;\n justify-content: center;\n align-items: center;\n height: 45px;\n width: 45px;\n cursor: pointer;\n border-radius: 50%;\n\n ${({ $isAvailable = false }) =>\n !$isAvailable &&\n css`\n cursor: default;\n opacity: 0;\n pointer-events: none;\n `};\n\n ${({ $isActive = false }) =>\n $isActive &&\n css`\n background-color: rgba(255, 255, 255, 0.2);\n `};\n\n text-shadow: 0 0 10px black;\n\n i {\n color: white;\n }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,OAAO,MAAMC,oBAAoB,GAAGF,MAAM,CAACG,GAAG;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMC,0BAA0B,GAAGJ,MAAM,CAACG,GAA8B;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE,YAAY,GAAG;AAAM,CAAC,KACvB,CAACA,YAAY,IACbJ,GAAG;AACX;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEK,SAAS,GAAG;AAAM,CAAC,KACpBA,SAAS,IACTL,GAAG;AACX;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ScannerToolbar.styles.js","names":["styled","css","StyledScannerToolbar","div","StyledScannerToolbarButton","$isAvailable","$isActive","StyledScannerToolbarPlaceholder"],"sources":["../../../../../src/components/code-scanner/scanner-toolbar/ScannerToolbar.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nexport const StyledScannerToolbar = styled.div`\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 85px;\n padding: 20px;\n display: flex;\n justify-content: space-between;\n\n color: white;\n`;\n\ntype ScannerToolbarButtonProps = {\n $isAvailable?: boolean;\n $isActive?: boolean;\n};\n\nexport const StyledScannerToolbarButton = styled.div<ScannerToolbarButtonProps>`\n display: flex;\n justify-content: center;\n align-items: center;\n height: 45px;\n width: 45px;\n cursor: pointer;\n border-radius: 50%;\n\n ${({ $isAvailable = false }) =>\n !$isAvailable &&\n css`\n cursor: default;\n opacity: 0;\n pointer-events: none;\n `};\n\n ${({ $isActive = false }) =>\n $isActive &&\n css`\n background-color: rgba(255, 255, 255, 0.2);\n `};\n\n text-shadow: 0 0 10px black;\n\n i {\n color: white;\n }\n`;\n\nexport const StyledScannerToolbarPlaceholder = styled.div`\n font-weight: bold;\n font-size: 20px;\n\n text-shadow:\n rgba(0, 0, 20, 0.9) 1px 1px 2px,\n rgba(0, 0, 20, 0.5) 0 0 4px;\n color: #ffffff;\n\n display: flex;\n align-items: end;\n margin-bottom: -10px;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,OAAO,MAAMC,oBAAoB,GAAGF,MAAM,CAACG,GAAG;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMC,0BAA0B,GAAGJ,MAAM,CAACG,GAA8B;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEE,YAAY,GAAG;AAAM,CAAC,KACvB,CAACA,YAAY,IACbJ,GAAG;AACX;AACA;AACA;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEK,SAAS,GAAG;AAAM,CAAC,KACpBA,SAAS,IACTL,GAAG;AACX;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMM,+BAA+B,GAAGP,MAAM,CAACG,GAAG;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -25,6 +25,10 @@ type CodeScannerProps = {
|
|
|
25
25
|
* Disables the zoom control if set to true.
|
|
26
26
|
*/
|
|
27
27
|
isZoomDisabled?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* A placeholder that should be displayed inside the preview.
|
|
30
|
+
*/
|
|
31
|
+
placeholder?: string;
|
|
28
32
|
/**
|
|
29
33
|
* Maximum allowed zoom level for the camera.
|
|
30
34
|
*/
|
|
@@ -37,6 +41,10 @@ type CodeScannerProps = {
|
|
|
37
41
|
* Callback function triggered when a code is successfully scanned.
|
|
38
42
|
*/
|
|
39
43
|
onScan?: CodeReaderOnScanCallback;
|
|
44
|
+
/**
|
|
45
|
+
* Whether a calling code icon should be displayed as an overlay.
|
|
46
|
+
*/
|
|
47
|
+
shouldShowIconOverlay?: boolean;
|
|
40
48
|
/**
|
|
41
49
|
* If true, allows scanning the same code multiple times in a row.
|
|
42
50
|
*/
|
|
@@ -4,4 +4,5 @@ type StyledCodeScannerPreviewProps = {
|
|
|
4
4
|
};
|
|
5
5
|
export declare const StyledCodeScannerTextWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
6
6
|
export declare const StyledCodeScannerPreview: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, StyledCodeScannerPreviewProps>> & string;
|
|
7
|
+
export declare const StyledCodeScannerIconOverlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
7
8
|
export {};
|
|
@@ -20,6 +20,10 @@ type ScannerToolbarProps = {
|
|
|
20
20
|
* Disables the zoom slider if set to true.
|
|
21
21
|
*/
|
|
22
22
|
isZoomDisabled?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* A placeholder that should be displayed inside the preview.
|
|
25
|
+
*/
|
|
26
|
+
placeholder?: string;
|
|
23
27
|
/**
|
|
24
28
|
* Maximum allowed zoom level for the camera.
|
|
25
29
|
*/
|
|
@@ -4,4 +4,5 @@ type ScannerToolbarButtonProps = {
|
|
|
4
4
|
$isActive?: boolean;
|
|
5
5
|
};
|
|
6
6
|
export declare const StyledScannerToolbarButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ScannerToolbarButtonProps>> & string;
|
|
7
|
+
export declare const StyledScannerToolbarPlaceholder: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
7
8
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/scanner",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.1268",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"publishConfig": {
|
|
84
84
|
"access": "public"
|
|
85
85
|
},
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "700e46e7b55797f2bad302a913d926ab3ff26af9"
|
|
87
87
|
}
|