This is a Next.js component: SearchInput.
example data:
[{"pid": "101", "pname": "apple" }, {"pid": "102", "pname": "banana" }, {"pid": "103", "pname": "orange" }]
components/searchinput.js
styles/searchinput.module.css
// disable ssr for random id
import dynamic from 'next/dynamic'
const SearchInput = dynamic(import('../components/searchinput').then(mod => mod.SearchInput), { ssr: false })