I want to get all element with tag ‘path’ of imported svg to handle animation for it. What is the best way to do this? Thanks!

My code look like this:

import React, { useEffect, useRef, useState } from 'react';
import MascotDisplay from '@/assets/mascot/4-pandy.svg'

export default function HomeScreen() {
    const svgRef = useRef(null);
    const fadeOut = ()=> {
        // I want to get all <path> of <MascotDisplay> svg to handle animation here
        // my code to animate svg here and need all <path> of svg
    }
    useEffect(()=>{
        fadeOut()
    }[])
}
return (
<View>
    <TouchableOpacity ref={svgRef} onPress={()=>{fadeOut()}}>
        <MascotDisplay width="100%" height="100%" viewBox='0 0 1024 1024' style/>
    </TouchableOpacity>
</View>
)