Incompatibility: React 19 + Expo SDK 54

[martluko]

The application crashes completely when captchaRef.current?.show() is called in the ExposureScannerScreen component.

Platform: React Native Expo (iOS/Android)
Environment:

    "@hcaptcha/react-native-hcaptcha": "2.1.0",
    "react": "19.1.0",
    "react-native": "0.81.5",
    "expo": "54.0.0",
    "react-native-modal": "14.0.0-rc.0",
    "react-native-webview": "13.16.0"

Implementation:

  import ConfirmHcaptcha from '@hcaptcha/react-native-hcaptcha';

  const captchaRef = useRef<React.ComponentRef<typeof ConfirmHcaptcha>>(null);

  // Triggers crash on React 19
  captchaRef.current?.show();

  <ConfirmHcaptcha
    hasBackdrop={false}
    ref={captchaRef}
    siteKey={siteKey}
    baseUrl={baseUrl}
    languageCode="en"
    size="invisible"
    onMessage={onCaptchaMessage}
  />

Attempted Workarounds patching with patch-package:

We attempted comprehensive patches to remove PropTypes and fix imports in:

1. @hcaptcha/react-native-hcaptcha (both Hcaptcha.js and index.js)
2. react-native-modal (dependency)
3. react-native-animatable (dependency of modal)

Result: App still crashes silently, likely due to deeper React 19 incompatibilities in the modal rendering or native bridge.

[faris-imi]

@martluko thanks for the report!

This error occurs when a component calls a state setter during the render phase.

Essentially, the ref typing is valid, but calling captchaForm.current.show() during render is illegal because it triggers a state update before the component has mounted, the call should be deferred to a post-render effect like:

  useEffect(() => {
    captchaForm.current?.show();
  }, []);