Before submitting a new issue

• I tested using the latest version of the library, as the bug might be already fixed.
• I tested using a supported version of react native.
• I checked for possible duplicate issues, with possible answers.

Bug summary

The react-native-hyperlink library throws a TypeError: Property 'ref' is not configurable error when used with React Native 0.82.1 and the new architecture (Fabric) enabled. This occurs because the library attempts to delete the ref property from component props, which is not allowed in React's new architecture.

Error Message

TypeError: Property 'ref' is not configurable
    at anonymous (Hyperlink.js:133:5)
    at anonymous (Hyperlink.js:157:26)
    at call (native)
    ...

Environment

• react-native-hyperlink version: 0.1.0
• react-native version: 0.82.1
• Platform: iOS and Android
• New Architecture: Enabled (newArchEnabled=true)
• Node version: (your node version)
• OS: macOS / Linux / Windows

4. Run the app
5. The error occurs when the Hyperlink component tries to clone the Text element

Expected Behavior

The Hyperlink component should work without errors and make URLs in text clickable.

Actual Behavior

The app crashes with TypeError: Property 'ref' is not configurable when the library tries to delete the ref property from component props before cloning.

Root Cause

In the Hyperlink.tsx file, the code attempts to delete the ref property:

const componentProps = component.props as TextProps;
delete (componentProps as {ref?: unknown}).ref;
delete (componentProps as {key?: unknown}).key;

In React Native's new architecture (Fabric), the ref property is non-configurable and cannot be deleted. This causes the error when React.cloneElement is called.

Proposed Solution

Instead of mutating the props object by deleting properties, create a new object without ref and key using destructuring:

Current code (lines 77-80 in lib/module/Hyperlink.js):

const componentProps = component.props;
delete componentProps.ref;
delete componentProps.key;

Fixed code:

// Create a new object without ref and key to avoid React's non-configurable ref error
const {ref: _ref, key: _key, ...componentProps} = component.props || {};

Same fix needed in the parse method (around line 132-134):

// Current:
const componentProps = component.props;
delete componentProps.ref;
delete componentProps.key;

// Fixed:
const {ref: _ref, key: _key, ...componentProps} = component.props || {};

Workaround

I've created a patch using patch-package that applies this fix. The patch file is available at:
patches/react-native-hyperlink+0.1.0.patch

Additional Context

• This issue is related to React Native's new architecture (Fabric) which has stricter rules about prop manipulation
• The fix is backward compatible and doesn't break existing functionality
• Similar issues have been reported in other React Native libraries when migrating to the new architecture

Suggested Priority

High - This breaks the library for all users with React Native 0.82+ and new architecture enabled.

Library version

0.1.0

Environment info

System:
  OS: macOS 26.1
  CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
  Memory: 503.45 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 24.2.0
    path: /var/folders/qq/q92k7j615m1692v6djjfkm0m0000gn/T/yarn--1764155601380-0.564424729565131/node
  Yarn:
    version: 1.22.22
    path: /var/folders/qq/q92k7j615m1692v6djjfkm0m0000gn/T/yarn--1764155601380-0.564424729565131/yarn
  npm:
    version: 11.3.0
    path: /usr/local/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /usr/local/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.5
      - iOS 18.5
      - macOS 15.5
      - tvOS 18.5
      - visionOS 2.5
      - watchOS 11.5
  Android SDK: Not Found
IDEs:
  Android Studio: 2025.2 AI-252.25557.131.2521.14432022
  Xcode:
    version: 16.4/16F6
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 21.0.7
    path: /Library/Java/JavaVirtualMachines/jdk-21.jdk/Contents/Home/bin/javac
  Ruby:
    version: 3.4.7
    path: /usr/local/opt/ruby/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 20.0.2
    wanted: ^20.0.0
  react:
    installed: 19.1.1
    wanted: 19.1.1
  react-native:
    installed: 0.82.1
    wanted: 0.82.1
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Steps to reproduce

Steps to Reproduce

1. Install [email protected]
2. Enable new architecture in android/gradle.properties: newArchEnabled=true
3. Use the Hyperlink component in a Text component:

import Hyperlink from 'react-native-hyperlink';

<Hyperlink linkDefault={true}>
  <Text>
    This text contains a URL https://example.com that should be clickable.
  </Text>
</Hyperlink>;

Patch File

diff --git a/node_modules/react-native-hyperlink/lib/module/Hyperlink.js b/node_modules/react-native-hyperlink/lib/module/Hyperlink.js
index 3a1728f..a2695a0 100644
--- a/node_modules/react-native-hyperlink/lib/module/Hyperlink.js
+++ b/node_modules/react-native-hyperlink/lib/module/Hyperlink.js
@@ -74,10 +74,9 @@ class Hyperlink extends Component {
     let elements = [];
     let _lastIndex = 0;
 
-    // Create component props (ref and key are React-specific and not in TextProps)
-    const componentProps = component.props;
-    delete componentProps.ref;
-    delete componentProps.key;
+      // Create component props (ref and key are React-specific and not in TextProps)
+      // Create a new object without ref and key to avoid React's non-configurable ref error
+      const { ref: _ref, key: _key, ...componentProps } = component.props || {};
     try {
       this.state.linkifyIt.match(childrenString)?.forEach(({
         index,
@@ -129,9 +128,8 @@ class Hyperlink extends Component {
       }
     } = component || {};
     if (!children) return component;
-    const componentProps = component.props;
-    delete componentProps.ref;
-    delete componentProps.key;
+    // Create a new object without ref and key to avoid React's non-configurable ref error
+    const { ref: _ref, key: _key, ...componentProps } = component.props || {};
     return /*#__PURE__*/React.cloneElement(component, componentProps, React.Children.map(children, child => {
       // Handle string children
       if (typeof child === 'string' && this.state.linkifyIt.pretest(child)) {

Reproducible example repository

N/A