Not used any another component tag in MDB table

Expected behavior Searching for text that is being rendered by a component should be displayed during a search.

Actual behavior I've noticed that if a cell's data is returned from another component, it is not being returned by search. This is the case whether JSX is returned, or even just returning the string value directly back still results in the record not being returned.

Resources (screenshots, code snippets etc.)

const My_Component = ({searchValue}) => {
        return <a href={`https://www.google.com/?query=${searchValue}`}>{searchValue}</a>;
    },
    data = {
        columns: [
            {
                label: 'Name',
                field: 'name'
            },
            {
                label: 'Search',
                field: 'search'
            }
        ],
        rows: [
            {
                name: 'Ashton Cox',
                search: <My_Component searchValue={'dogs'} />
            },
            {
                name: 'Cedric Kelly',
                search: <My_Component searchValue={'cats'} />
            },
            {
                name: 'Airi Satou',
                search: 'No Search'
            }
        ]
    };

<MDBDataTable className="cstm-data-tbl"
      responsive
      hover
      data={data}
      sortRows={[]}
    />