diff --git a/src/Camera.android.tsx b/src/Camera.android.tsx index 0a47aff6d..d5e8b7e81 100644 --- a/src/Camera.android.tsx +++ b/src/Camera.android.tsx @@ -8,16 +8,6 @@ import NativeCameraKitModule from './specs/NativeCameraKitModule'; const Camera = React.forwardRef((props, ref) => { const nativeRef = React.useRef(null); - // RN doesn't support optional view props yet (sigh) - // so we have to use -1 to indicate 'undefined' - // All int/float/double props from src/specs/CameraNativeComponent.ts need be mentioned here - props.zoom = props.zoom ?? -1; - props.maxZoom = props.maxZoom ?? -1; - props.scanThrottleDelay = props.scanThrottleDelay ?? -1; - props.faceDetectionThrottleMs = props.faceDetectionThrottleMs ?? -1; - - props.allowedBarcodeTypes = props.allowedBarcodeTypes ?? supportedCodeFormats; - React.useImperativeHandle(ref, () => ({ capture: async (options = {}) => { return await NativeCameraKitModule.capture(options, findNodeHandle(nativeRef.current) ?? undefined); @@ -30,10 +20,22 @@ const Camera = React.forwardRef((props, ref) => { }, })); - const transformedProps: CameraProps = { ...props }; - transformedProps.ratioOverlayColor = processColor(props.ratioOverlayColor) as any; - transformedProps.frameColor = processColor(props.frameColor) as any; - transformedProps.laserColor = processColor(props.laserColor) as any; + // RN can't express optional int/float view props yet, so we default + // undefined -> -1 (and other sentinels). Build a NEW object instead of + // mutating `props`: React freezes element props in dev, so writing to them + // throws "Cannot add new property" once the module runs in strict mode + // (ES modules are always strict). + const transformedProps: CameraProps = { + ...props, + zoom: props.zoom ?? -1, + maxZoom: props.maxZoom ?? -1, + scanThrottleDelay: props.scanThrottleDelay ?? -1, + faceDetectionThrottleMs: props.faceDetectionThrottleMs ?? -1, + allowedBarcodeTypes: props.allowedBarcodeTypes ?? supportedCodeFormats, + ratioOverlayColor: processColor(props.ratioOverlayColor) as any, + frameColor: processColor(props.frameColor) as any, + laserColor: processColor(props.laserColor) as any, + }; // @ts-expect-error props for codegen differ a bit from the user-facing ones return ; diff --git a/src/Camera.ios.tsx b/src/Camera.ios.tsx index 63d3c87b6..8c7ac2562 100644 --- a/src/Camera.ios.tsx +++ b/src/Camera.ios.tsx @@ -8,19 +8,22 @@ import NativeCameraKitModule from './specs/NativeCameraKitModule'; const Camera = React.forwardRef((props, ref) => { const nativeRef = React.useRef(null); - // RN doesn't support optional view props yet (sigh) - // so we have to use -1 to indicate 'undefined' - // All int/float/double props from src/specs/CameraNativeComponent.ts need be mentioned here - props.zoom = props.zoom ?? -1; - props.maxZoom = props.maxZoom ?? -1; - props.scanThrottleDelay = props.scanThrottleDelay ?? -1; - props.faceDetectionThrottleMs = props.faceDetectionThrottleMs ?? -1; - props.iOsDeferredStart = props.iOsDeferredStart ?? true; - - props.allowedBarcodeTypes = props.allowedBarcodeTypes ?? supportedCodeFormats; - - props.resetFocusTimeout = props.resetFocusTimeout ?? 0; - props.resetFocusWhenMotionDetected = props.resetFocusWhenMotionDetected ?? true; + // RN can't express optional int/float view props yet, so we default + // undefined -> -1 (and other sentinels). Build a NEW object instead of + // mutating `props`: React freezes element props in dev, so writing to them + // throws "Cannot add new property" once the module runs in strict mode + // (ES modules are always strict). + const transformedProps: CameraProps = { + ...props, + zoom: props.zoom ?? -1, + maxZoom: props.maxZoom ?? -1, + scanThrottleDelay: props.scanThrottleDelay ?? -1, + faceDetectionThrottleMs: props.faceDetectionThrottleMs ?? -1, + iOsDeferredStart: props.iOsDeferredStart ?? true, + allowedBarcodeTypes: props.allowedBarcodeTypes ?? supportedCodeFormats, + resetFocusTimeout: props.resetFocusTimeout ?? 0, + resetFocusWhenMotionDetected: props.resetFocusWhenMotionDetected ?? true, + }; React.useImperativeHandle(ref, () => ({ capture: async () => { @@ -35,7 +38,13 @@ const Camera = React.forwardRef((props, ref) => { })); // @ts-expect-error props for codegen differ a bit from the user-facing ones - return ; + return ( + + ); }); export default Camera;