how to pass ref from parent to child Touchable Opacity in react native?

i have a transitioning ref in a parent Transitioning view i want to pass in a child:

const transition = (
  <Transition.Together>
    <Transition.In type="fade" durationMs={300} />
    <Transition.Change />
    <Transition.Out type="fade" durationMs={300} />
  </Transition.Together>
);
const FiltersModal: FC = () => {
const transitionRef = useRef<TransitioningView>(null);
return (
<FiltersContainer ref={transitionRef} transition={transition}>
 ...
{primaryFilters.map((primaryFilter, i) => (
    <FilterOption key={i} ref={transitionRef} label={primaryFilter}>
      {primaryFilter}
    </FilterOption>
  ))}

and this is my filter option following an answer from here: ForwardRef error with typescript and react-native:

const FilterOption: React.ComponentType<FilterOptionProps> = React.forwardRef(
  ({ label }: FilterOptionProps, ref?: React.Ref<TransitioningView>) => {
    const [isSelected, setiIsSelected] = useState(false);
    const onPress = () => {
      if (ref.current) ref.current.animateNextTransition();
      setiIsSelected((prevIsSelected) => !prevIsSelected);
    };
    if (isSelected) return null;
    return (
      <Button>
        <Typography
          {...{
            fontFamily: FONTS_MONTSERRAT_500,
            fontWeight: 500,
            fontSize: 14,
            fontStyle: "normal",
            lineHeight: 20,
            color: "#00B0F0",
          }}
        >
          {label}
        </Typography>
        <AntDesign name="plus" color="#00b0f0" size={10} />
      </Button>
    );
  }
);

but i have this warning and cannot referrence ref.current.:

Type 'ForwardRefExoticComponent<Pick<FilterOptionProps, "label"> & RefAttributes<TransitioningView>>' ....

How do i use forwardref in a touchableOpacity in react native + typescript?