element.ref React 19

[erie-e9]

Current behavior

Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.

Expected behavior

Terminal throws this error using this package, it disappears when replace it for FlatList

To Reproduce

import React from "react";
import { View, Text } from "react-native";
import { FlashList } from "@shopify/flash-list";

const DATA = [
  {
    title: "First Item",
  },
  {
    title: "Second Item",
  },
];

const MyList = () => {
  return (
    <FlashList
      data={DATA}
      renderItem={({ item }) => <Text>{item.title}</Text>}
      estimatedItemSize={200}
    />
  );
};

Platform:

• iOS
• Android

Environment

hermes enabled, new arch

"react": "19.0.0",
"react-native": "0.78.0",
"@shopify/flash-list": "^1.7.3",

[edgecaststudio]

Same issue

[kilinc89]

same issue.
Shopify team should update how refs are handled in the component

  private recyclerRef = (ref: any) => {
    this.rlvRef = ref;
  };

  private stickyContentRef = (ref: any) => {
    this.stickyContentContainerRef = ref;
  };

[craiganderson-iotv]

The React Native (0.78.0) stacktrace seems to point towards this line.

I'm not sure whether the issue is truly within the Flashlist or Flipkart/recyclerlistview though.

[enesuur]

I am facing the same issues, please let me know if any updates, thanks!

[MGS-DEV]

Same here!

[VadymVashchuk]

Same issue

[himanshund123]

same issue

[naqvitalha]

I'm looking into this. I'll update soon.

[naqvitalha]

I've fixed the issue in recyclerlistview. We'll release a new version once it's merged.

[naqvitalha]

We're having some issues with npm. The latest version is not visible to npm cli. We're working to resolve it ASAP

[craiganderson-iotv]

Thanks for fixing!

I can confirm that it is all working and available via yarn now.